AngularJS factory two way data binding -


I have an angular controller with some binded variables, and a factory that produces an array of controllers ('' b '');

MyController ', [' $ scope ',' Authentication ',' MyFactory ', function ($ scope, authentication, MyFactory) {$ scope.user = Authentication.user; $ scope.options = MyFactory.getOptions ($ scope.user. FirstName, $ scope.user.lastName); ...} ...} Factory MyFactory angular.module ('those') factory ('MyFactory', function () {var only this = this; _this._data = {GetOptions:. Function (firstName, lastName) {return [firstName + "+ lastName, lastName +" + first name ...];}}; return _this._data;});

This is a Works well for the first time, but does not process data between the controller and the factory.

The intention effect is that in a logic of MyFactory.getOptions () The change resulted in $ scope.options .

This works for the first time Because you are calling a function that gives a new array, and then your view only references that array, and the function never calls again MyFacto A $ range for your $ scope.user variable, remembering the ry.getOptions function. Adding $ watch is the easiest solution.

  // Controller MyController angular.module ('those'). Controller ('MyController', ['$ theme-area', 'authentication', 'MyFactory', function ($ scope, authentication, MyFactory) {$ scope.user = Authentication.user; $ scope.options = MyFactory.getOptions ( $ Scope.user.firstName, $ scope.user.lastName); $ scope $ watch ("user", function (newVal, oldVal, scope) {scope.options = MyFactory.getOptions (newVal.firstName, newVal.lastName) ;}); ...} ...}  

There is something like that. According to your comment, do something like this:

  // Controller MyController angular.module ('User').  

Controller ('MyController', ['$ scope', 'Authentication', 'Ma FACTORY ', Function ($ Range, Authentication, MyFactory) {$ scope.user = Authentication. User; $ Scope.options = MyFactory.getOptions ($ scope, "user"); ...} ...} // Factory MyFattery Engineer Module ('user'). Factory ('mifcrici', function) {var _this = this; _this._data = {getOptions: function (scope, property) {updateableArray = []; function updateArray (user) { // Delete all elements of updateableArray updateableArray.clear (); // Adding all new elements of updateableArray from user logic updateableArray.push (firstName + '' + lastName); UpdateableArray .push (lastName + '' + firstName); ....} Scope $ watch (property, function (newVal, oldVal, watchScope) {updateArray (newVal);}) ;. UpdateArray (scope [property]); Returned updateableArray;}}; Return _this._data;});

Of course it is a better way to organize, but hopefully it will help you get this idea.


Comments

Popular posts from this blog

c# - SignalR: "Protocol error: Unknown transport." when navigating to hub -

class - Kivy: how to instantiate a dynamic classes in python -

python - mayavi mapping a discrete colorbar on a surface -