Двойная привязка данных с контроллером angularjs в качестве стиля

#javascript #angularjs #binding #syntax #angularjs-scope

#javascript #angularjs #привязка #синтаксис #angularjs-область

Вопрос:

Я ищу, как использовать двойную привязку данных в angularjs с учетом контроллера в качестве стиля, рекомендованного Google. Это выглядит так:

 hello.mainpage.HomeCtrl = function() {
  /**
   * @type {string}
   * @export
   */
  this.myColor = 'blue';
};
  

Потому что я не могу использовать $scope.$watch или $scope.keypress . Каков наилучший способ сделать это?

Ответ №1:

Двусторонняя привязка данных является частью «магии» Angular и представляет собой процесс, с помощью которого Angular автоматически синхронизирует представление с моделью. Это не должно иметь никакого значения, если вы используете «обычный» синтаксис контроллера с $scope или синтаксис «controller as» без scope. Двусторонняя привязка данных работает точно так же.

Например.:

«Контроллер» «$scope»:

 <div ng-controller="someCtrl">
    <input type="text" ng-model="someStr" />
</div>

.controller('someCtrl', function ($scope) {
    $scope.someStr = 'Hello, world !';
});
  

Двусторонняя привязка данных работает как обычно.


«Контроллер как» «нет $scope»:

 <div ng-controller="someCtrl as ctrl">
    <input type="text" ng-model="ctrl.someStr" />
</div>

.controller('someCtrl', function () {
    this.someStr = 'Hello, world !';
});
  

Двусторонняя привязка данных работает и здесь.


С другой стороны, если вы хотите $watch что-то, то вам нужен $scope (который синтаксис «контроллер как» не запрещает вам использовать).


Все вышесказанное хорошо проиллюстрировано в этой короткой демонстрации.