$ scopeはattrsの値としてattrsに渡されますが、controllerは返す文字列を返します

私のリンク関数内で$ scopeを使用してディレクティブの値が渡されると、attrs変数を使用してそれらにアクセスできます。渡された文字列だけにアクセスします。ここに私のコードがある

ディレクティブコール

<div linear-chart chart-data="salesData"></div></div> 
<div linear-chart2 chart-data="ctrl.salesData2"></div></div>

ここディレクティブ

app.directive('linearChart', function($window){ 
    return{ 
     restrict:'EA', 
     template:"some template", 
     link: function(scope, elem, attrs){ 
      console.log(attrs.chartData); 
     } 
    } 
}

のコードattrs.chartDataはJSON

として$ scope.salesDataとしてルートコントローラに渡されたデータをdisplayes

app.directive('linearChart2', function($window){ 
    return{ 
     restrict:'EA', 
     template:"some template", 
     link: function(scope, elem, attrs){ 
      console.log(attrs.chartData); 
     } 
    } 
}

ここでchartDataは文字列ctrl.salesData2のみを表示します。事前にどうやって進めていくのですか？

出典

2016-09-26 user93

任意のデモコードは素晴らしいことです！ –

あなたはモデルからそのコンテンツを表示するために、二重括弧に{{ }}を使用する必要があります。

(function(angular) { 
 
    'use strict'; 
 
angular.module('docsTemplateUrlDirective', []) 
 
    .controller('Controller', ['$scope', function($scope) { 
 
    var vm = this; 
 
    vm.type = "Name"; 
 
    vm.type1 = "Address"; 
 
    }]) 
 
    .directive('myCustomer', function() { 
 
    return { 
 
     template: function(elem, attr) { 
 
     return attr.type; 
 
     } 
 
    }; 
 
    }); 
 
})(window.angular); 
 

 
/* 
 
Copyright 2016 Google Inc. All Rights Reserved. 
 
Use of this source code is governed by an MIT-style license that 
 
can be found in the LICENSE file at http://angular.io/license 
 
*/

<!doctype html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Example - example-directive-template-url-fn-production</title> 
 
    
 

 
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
 
    <script src="script.js"></script> 
 
    
 

 
    
 
</head> 
 
<body ng-app="docsTemplateUrlDirective"> 
 
    <div ng-controller="Controller as ctrl"> 
 
    <div my-customer type="{{ctrl.type}}"></div> 
 
    <div my-customer type="{{ctrl.type1}}"></div> 
 
</div> 
 
</body> 
 
</html> 
 

 
<!-- 
 
Copyright 2016 Google Inc. All Rights Reserved. 
 
Use of this source code is governed by an MIT-style license that 
 
can be found in the LICENSE file at http://angular.io/license 
 
-->

私はそれはあなたの問題を解決を願っを

出典

2016-09-26 07:48:04 fenix688

オブジェクトを取得するには、attrs.chartDataはすべき評価（スコープで$ eval）

<div linear-chart chart-data="salesData"></div> 
console.log(scope.$eval(attrs.chartData))

か、JSON文字列を取得したい場合は、何があって、コントローラの構文は{{}}

<div linear-chart chart-data="{{ salesData }}"></div>

を使用していません。

JSFiddle

出典

2016-09-26 07:53:46

ディレクティブの結合オブジェクトを使用します。

app.directive('linearChart2', function($window){ 
    return{ 
     restrict:'EA', 
     scope: { 
      chartData: "=" 
     }, 
     template:"some template", 
     link: function(scope, elem, attrs){ 
      console.log(scope.chartData); 
     } 
    } 
}

代わりに、あなただけの$scope.$evalで与えられた式を評価することができます

app.directive('linearChart2', function($window){ 
    return{ 
     restrict:'EA', 
     template:"some template", 
     link: function(scope, elem, attrs){ 
      var evaluatedData = scope.$eval(attrs.chartData); 
      console.log(evaluatedData); 
     } 
    } 
}

出典

2016-09-26 08:00:49 devqon

$ scopeはattrsの値としてattrsに渡されますが、controllerは返す文字列を返します

答えて

関連する問題