Question

我很担心如何解决Angular js中的以下场景。我需要在页面的加载上绘制一个图形，所以我在指令的链接函数中进行。但我很困惑如何确定变量初始化的顺序。在下面的例子中，它作为声明的顺序工作，但它在我的实际代码中没有按顺序工作。

请参阅示例代码here

第一次调用drawBarGraph（）失败，因为变量graphType尚未初始化。那么，有没有更好的方法呢。

Answer 1

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

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
});

app.directive('test', function(){

    return{
        restrict:'E', 
        scope:{
            data:'@',
            graphtype:'@graphtype'
        },
        template:'<div></div>',
        link:function(scope,element,attr){
          scope.graphType = attr['graphType'];
          scope.value = attr['data'];

            attr.$observe('graphtype', function(value) {
                if (value) {
                    scope.graphType=value;
                    scope.drawBarGraph()
                  }
            });

            attr.$observe('data', function(value) {
                if (value) {
                    scope.value=value;
                    scope.drawBarGraph()
                }
            });
         scope.drawBarGraph=function()
         {
             if(!scope.value || !scope.graphType)
                  return; //not enough information to proceed maybe log this
             console.log(scope.value);
             console.log(scope.graphType);
         }

        }
    }
})

我最初在链接函数中提取了变量，所以如果它们已经设置好，那么它们就会填充在指令的范围内。

我也交换了观察的顺序，但实际上最好先检查一下你的功能中是否设置了所有值，然后再进行操作。

如何确定指向Angular js的链接函数中的变量初始化顺序

1 个答案: