1

ディレクティブを実行しています。スコープ上でコンソールを実行すると奇妙な動作が発生します。コントローラ スコープから渡された値が出力されますが、スコープからアクセスしようとすると、scope.modelのように未定義です。

これはコードです：

function() {
        var color = d3.interpolateRgb('#f77', '#77f');  
        return {
            template: '<div></div>',
            restrict: 'E',
            scope:{
                model:'='
            },
            link: function postLink(scope, element, attrs) {

                console.log(scope); //print model
                console.log('scope.model ',scope.model); // undefined

                var width = attrs.width || 940,
                    height = attrs.height || 500,
                    margin = 20;

                var modeler = d3.select(element[0])
                    .append('svg')
                    .attr('width', width)
                    .attr('height', height);

            }
        };
    }

HTML

<d3-directive model="model" width="920" height="510" ></d3-directive>

コンソール出力を見てください： コンソール出力

4

1 に答える 1

1

スコープの $watch over 値を追加し、割り当てられた新しい値を使用して終了しました。

return {
        template: '<div></div>',
        restrict: 'E',
        scope:{
            model:'='
        },
        link: function postLink(scope, element, attrs) {

            console.log(scope); 
            console.log('scope.model ',scope.model);

            scope.$watch('model',function(newValue,oldValue){
                if(!!newValue){
                    console.log(newValue);
                }
            });

            var width = attrs.width || 940,
                height = attrs.height || 500,
                margin = 20;

            var modeler = d3.select(element[0])
                .append('svg')
                .attr('width', width)
                .attr('height', height);

        }
    };
于 2014-10-21T17:52:21.720 に答える