Scope issues with Angular UI modal

by

When nested scopes are involved, do not bind <input>s directly to members of the scope:

<input ng-model="name" /> <!-- NO -->

Bind them to at least a level deeper:

<input ng-model="form.name" /> <!-- YES -->

The reason is that scopes prototypically inherit their parent scope. So when setting 1st level members, these are set directly on the child scope, without affecting the parent. In contrast to that, when binding to nested fields (form.name) the member form is read from the parent scope, so accessing the name property accesses the correct target.

Read a more detailed description here.

More Related Contents:

  1. Controller not a function, got undefined, while defining controllers globally
  2. How do I share $scope data between states in angularjs ui-router?
  3. Angularjs Uncaught Error: [$injector:modulerr] when migrating to V1.3
  4. Losing scope when using ng-include
  5. How to do two-way filtering in AngularJS?
  6. How to set the id attribute of a HTML element dynamically with angularjs (1.x)?
  7. $watch an object
  8. ion-content and ion-footer have different $scope
  9. Update parent scope variable in AngularJS
  10. Angularjs: call other scope which in iframe
  11. Angularjs: ‘controller as syntax’ and $watch
  12. Dynamic form name attribute in Angularjs
  13. Can an angular directive pass arguments to functions in expressions specified in the directive’s attributes?
  14. Limiting number of displayed results when using ngRepeat
  15. AngularJS: open a new browser window, yet still retain scope and controller, and services
  16. Confirmation dialog on ng-click – AngularJS
  17. Genuinely stop a element from binding – unbind an element – AngularJS
  18. ng-click not working in dynamically created content
  19. Ionic Framework: $scope is undefined in simple alert
  20. AngularJS using $rootScope as a data store
  21. What is the difference between $scope.$root and $rootScope?
  22. Angular controller scope not updating after jQuery ajax call
  23. AngularJS event on window innerWidth size change
  24. Migrating AngularJS to Angular 4,5 (with DEMO) [closed]
  25. Node.js variable declaration and scope
  26. Composing multipart/form-data with a different Content-Type on each parts with Javascript (or Angular)
  27. AngularJS Directives: Change $scope not reflected in UI
  28. Angularjs does not load scripts within ng-view
  29. How can I use HTTPS in AngularJS?
  30. Clear localStorage on tab/browser close but not on refresh

Leave a Comment