Как привязать переменную к объектам в AngularJS?
В приведенном ниже коде и после использования bind (this) я смог использовать this.name в configureItemScope.
Однако, когда я вызываю updatename (), значение itemScope.item не обновляется. вроде это не привязка к this.name?
module.controller('ListController', function () {
this.name = "initial";
this.delegate = {
configureItemScope: function (index, itemScope) {
itemScope.item = this.name;
}.bind(this)};
this.updatename = function(){ this.name = "changed"; }.bind(this)
});
При нажатии на кнопку значения не изменяются: https://codepen.io/scatman007/pen/PywGor
<ons-page ng-controller = "ListController as list">
<ons-button ng-click = "list.change()">click to change</ons-button>
<ons-list>
<ons-list-item ons-lazy-repeat = "list.delegate">{{ item }}</ons-list-item>
</ons-list>
</ons-page>
JS
ons.bootstrap()
.controller('ListController', function() {
this.delegate = {
configureItemScope: function(index, itemScope) {itemScope.item = "OLD";},
countItems: function() {return 0;}
};
this.change = function()
{
this.delegate.configureItemScope= function(index, itemScope) {
itemScope.item = "NEW";
}
this.delegate.countItems= function() { return 1000;}
}.bind(this);
});
Я отредактировал вопрос, использую bind (this), но у меня проблема с привязкой
Есть две функции, использующие это. Вы связали одного.
о да имеет смысл! однако он все еще не работает после привязки имени обновления к этому
Вам следует избегать привязки this и использовать синтаксис controller-as и некоторую переменную viewModel vm для контроллеров. Кроме того, почему itemScope.item должен обновлять свое значение автоматически, он просто привязывается к this и не слушает событие изменения this.name.
На самом деле я использую controller-as. Можете ли вы опубликовать образец кода для обновления itemScope, прослушивая событие изменения для this.name? другими словами, как я могу изменить this.delegate и привязать изменение к моему html: <ons-list-item ons-lazy-repeat = "list.delegate"> {{item}} </ons-list-item>
Задавая вопрос о проблеме, вызванной вашим кодом, вы получите гораздо лучшие ответы, если предоставите код, который люди могут использовать для воспроизведения проблемы. Этот код должен быть… Полный - Предоставьте все части, необходимые для воспроизведения проблемы, включая HTML и используемые библиотеки. См. Как создать минимальный, полный и проверяемый пример,
@georgeawg это мой код: codepen.io/scatman007/pen/PywGor
Ответы 1
Из Документов:
AngularJS modifies the normal JavaScript flow by providing its own event processing loop. This splits the JavaScript into classical and AngularJS execution context. Only operations which are applied in the AngularJS execution context will benefit from AngularJS data-binding, exception handling, property watching, etc...
You can also use $apply() to enter the AngularJS execution context from JavaScript. Keep in mind that in most places (controllers, services)
$applyhas already been called for you by the directive which is handling the event. An explicit call to$applyis needed only when implementing custom event callbacks, or when working with third-party library callbacks.
Для получения дополнительной информации см. Руководство разработчика AngularJS - Интеграция с циклом событий браузера.
Я попытался добавить $ scope. $ apply (), но все равно не работал. кстати, вот мой код: codepen.io/scatman007/pen/PywGor
Возможный дубликат Как получить доступ к правильному `this` внутри обратного вызова?