使用监视

时间:2016-04-27 11:48:22

标签: angularjs

我在Parent Controller的http.get()方法中定义了$ scope变量。我无法直接从子控制器访问它,因为它的说法是未定义的。当我使用Watch功能从我的Child Controller访问那些范围变量时,它工作正常。但是对于更多数量的范围变量我如何使用监视功能?或者不使用监视是另一种方法吗? 我在这里更新了我的小提琴click here fiddle for accessing more number of parent scope variables

    function ParentCtrl($scope, $http) {
        $scope.cities = ["NY", "Amsterdam", "Barcelona"];
      
      //  $scope.example1 = $http.get('/echo/json');
        $http.get('/echo/json').then(function(value) {
  	    $scope.example2 = value.status;
    		});
        $http.get('/echo/json/error').then(null,function(value) {
        $scope.example3 = value.status;
        });
        $http.get('/echo/json').success(function(data, status, headers, config) {
        $scope.example4 = status;
        });
        $http.get('/echo/json/error').error(function(data, status, headers, config) {
        $scope.example5 = status;
        });        
        $http.get('/echo/json/error').catch(function(value) {
        $scope.example6 = value.status;
        });        
      
        }
        
    function ChildCtrl($scope) {
        $scope.parentcities = $scope.$parent.cities;
     //   console.log("1=="+$scope.example1);//undefined
        console.log("2=="+$scope.example2);//undefined
        console.log("3=="+$scope.example3);//undefined
        console.log("4=="+$scope.example4);//undefined
        console.log("5=="+$scope.example5);//undefined
        console.log("6=="+$scope.example6);//undefined
        
        
        
         /*$scope.$watch("example1", function(example1) {
        if(angular.isDefined(example1)){
        console.log("1_watch=="+$scope.example1); //Defined 
        }
        });*/
         $scope.$watch("example2", function(example2) {
        if(angular.isDefined(example2)){
        console.log("2_watch=="+$scope.example2); //Defined 
        }
        });
         $scope.$watch("example3", function(example3) {
        if(angular.isDefined(example3)){
        console.log("3_watch=="+$scope.example3); //Defined 
        }
        });
         $scope.$watch("example4", function(example4) {
        if(angular.isDefined(example4)){
        console.log("4_watch=="+$scope.example4); //Defined 
        }
        });
         $scope.$watch("example5", function(example5) {
        if(angular.isDefined(example5)){
        console.log("5_watch=="+$scope.example5); //Defined 
        }
        });
        $scope.$watch("example6", function(example6) {
        if(angular.isDefined(example6)){
        console.log("6_watch=="+$scope.example6); //Defined 
        }
        });
    }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.min.js"></script>
   <div ng-app ng-controller="ParentCtrl">
        <div ng-controller="ChildCtrl as vm">
           {{$parent.cities}}
        </div>
    </div>

1 个答案:

答案 0 :(得分:0)

在这种情况下,你不应该使用watch和$ parent。

可以在父控制器中使用事件($ broadcast)来通知子控制器该值已被检索并可以使用。

$scope.$broadcast("example1",$scope.example1)  //parent controller

$scope.$on("example1",function(data){
  // Do stuff
}) //child controller

如果必须跨控制器共享数据,我首选的方法是将数据存储在工厂中。

如果由于某种原因你仍然需要$ watch,你可以在检索数据后终止它,这样它就不再运行了。这可以通过使用$ watch()返回的回调来完成。

var killExample4 = $scope.$watch("example4", function(example4) {
  if(angular.isDefined(example4)){
    console.log("4_watch=="+$scope.example4); //Defined 
    killExample4();
  }
});