如何在AngularJS中控制台从控制器到指令控制器的更改

How to console a change from controller to directive controller in AngularJS

本文关键字：指令控制器 控制器 AngularJS 控制台      更新时间：2023-09-26

以下是运行良好、没有问题的代码。我唯一不能得到的就是

每当按下按钮时，我如何控制台console.log("CHECK ",vm.testvar);。

工作Plnkr-http://plnkr.co/edit/BGdGgGaDXlKiZq2aaN00?p=preview

script.js-

var myApp = angular.module('myApp', []);
myApp.controller('mainCtrl', function($scope){
  $scope.test = 'my test string from controller';
  $scope.clicked = function() {
    $scope.test = 'New - ' + Date.now();
  };
})
myApp.directive('mydir', function(){
  return {
    restrict: 'E',
    scope: {
      testvar: '='
    },
    template: '<h1>Test Directive - {{vm.testvar}}</h1>',
    controllerAs: 'vm',
    replace: true,
    bindToController: true,
    controller: function () {
      var vm = this;
      console.log("CHECK ",vm.testvar);
    }
  };
})

有多种方法可以实现这一点，但最快的方法，可能也是最角度1.*-ish的方法是使用$scope.$watch方法：

controller: function ($scope) {
  var vm = this;
  $scope.$watch( 'vm.testvar', function(newValue){ 
    console.log( 'cHanged', newValue)
  })
  console.log("CHECK ",vm.testvar);
}

http://plnkr.co/edit/KsrG5lgmtyKSGce5HZ6F?p=preview

您可以将$scope传递给控制器，并在vm.testvar上设置一个监视。然后，每当vm.testvar发生变化时，它都会调用其函数。

controller: function (scope) {
  var vm = this;
  $scope.$watch('vm.testvar', function() {
     console.log("CHECK ",vm.testvar);
  });
}
相关文章：