$範圍作爲attrs的值傳遞，而控制器作爲返回字符串

當在指定的值在我的鏈接功能內使用$ 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裏顯示的是在根控制器通過爲$ scope.salesData作爲JSON數據

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

$範圍作爲attrs的值傳遞，而控制器作爲返回字符串

回答

相關問題