AngularJS:更改`$ watch`方法中未触发的对象

时间:2022-12-02 15:58:47

As a basic i am keeping a object with some default values. once i am fetching the value from the server, i am updating the object. when i am updating that's not triggering to the $watch method. i any one help me know the reason here?

作为一个基本我保持一个具有一些默认值的对象。一旦我从服务器获取值,我正在更新对象。当我更新时,不会触发$ watch方法。我有谁帮我知道这里的原因?

my controller.js :

我的controller.js:

$scope.graphInfo = {"ActualPercentage" : 30, "Type" : "Mechanical" };
        // default sets

        $scope.conractorInfo = function ( contractor ) {

            $location.search('id', contractor.Id);

            server.contractor.get({id:$routeParams.id, contid:contractor.Id}).$promise.then(function (data) {

                $scope.contractor = data;
                $scope.graphInfo.ActualPercentage = Number($scope.contractor.ActualPercentage);
                $scope.graphInfo.Type = $scope.contractor.Type;
                //updating object
            });

        }

my template with directive :

我的模板与指令:

    <plan-vs-actual data="graphInfo"></plan-vs-actual>

//getting graph info.

my directive :

我的指示:

    var planVsActual = function ($timeout) {

        return {

            replace : true,

            scope : {

                data : '='
            },

            template : "<div id='pieGraph'></div>",

            link : function ( scope, element, attr ) {


                var width = element.width(), 
                height = element.height(),
                radius = Math.min(width, height) / 1.2;

                var color = d3.scale.ordinal().range(["#ffff00", "#1ebfc5"]);

                var pie = d3.layout.pie().sort(null).value(function(d) { return d });

                var arc = d3.svg.arc().outerRadius(radius - 90).innerRadius(radius - 85);

                var svg = d3.select("#pieGraph").append("svg").attr("width", width).attr("height", height)
                         .append("g").attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");

                scope.$watch ('data', function ( newValue, oldvalue ) {

                    console.log( newValue );
//after i am updating using server values, not updating here.

                });
    }
    }
    }

1 个解决方案

#1


1  

Set the 3rd argument of $watch to true

将$ watch的第3个参数设置为true

modify like,

scope.$watch ('data', function ( newValue, oldvalue ) {

    console.log( newValue );

 }, true);

// put true to watching properties

3rd argument is the objectEquality it will Compare for object equality using angular.equals instead of comparing for reference equality.

第三个参数是objectEquality,它将使用angular.equals比较对象的相等性,而不是比较引用相等性。

here is the DOC

这是DOC

not sure just give a try.

不确定只是试一试。

#1


1  

Set the 3rd argument of $watch to true

将$ watch的第3个参数设置为true

modify like,

scope.$watch ('data', function ( newValue, oldvalue ) {

    console.log( newValue );

 }, true);

// put true to watching properties

3rd argument is the objectEquality it will Compare for object equality using angular.equals instead of comparing for reference equality.

第三个参数是objectEquality,它将使用angular.equals比较对象的相等性,而不是比较引用相等性。

here is the DOC

这是DOC

not sure just give a try.

不确定只是试一试。