为什么我在AngularJs中的指令不起作用？

问题描述：

我有3个文件：product-title.html，index.html调用product-title和app.js来创建我的指令。我的浏览器没有显示在产品title.html代码为什么我在AngularJs中的指令不起作用？

产品title.html

<h3> 
    {{product.name}} 
    <em class="pull-right">{{product.price | currency}}</em> 
</h3>

的index.html

<html ng-app="gemStore"> 
<head> 
    <script type="text/javascript" src="angular.min.js"></script> 
    <script type="text/javascript" src="app.js"></script> 
</head> 
<body> 
<div class="list-group" ng-controller="StoreController as store"> 
    <div class="list-group-item cuerpo" ng-repeat="product in store.products"> 
    <product-title></product-title> 
    </div> 
</div> 
</body>

app.js

(function() { 
var app = angular.module('gemStore', []); 

app.controller('StoreController', function(){ 
    this.products = gems; 
}); 

app.directive('productTitle', function(){ 
    return { 
    restrict: "E", 
    templateUrl: "product-title.html" 
    }; 
}); 
})();

宝石是一系列具有名称，价格等的对象。该代码正在工作j直到我试图创建第一个指令。

您是否获得在调试器的任何错误？任何网络错误？ – zero298

在你写的this.products = gems;这里的宝石是什么？你有什么错误吗？ – Indra

尝试在控制器中导入$ scope并执行$ scope.products = gems; – mdegges

答

可以帮助你。

<html ng-app="gemStore"> 
<head> 
    <script type="text/javascript" src="angular.min.js"></script> 
    <script type="text/javascript" src="app.js"></script> 
</head> 
<body> 
<div class="list-group" ng-controller="StoreController"> 
    <div class="list-group-item cuerpo" ng-repeat="product in products"> 
    <product-title></product-title> 
    </div> 
</div> 
</body>

JS代码：

var app = angular.module('gemStore', []); 
app.controller('StoreController', function($scope){ 
    var gems = [  
       {name: "LIVKR-2015", price: 20}, 
       {name: "LIVHCC-2015", price: 22}, 
       {name: "LIKKCC-2015", price: 24}, 
       {name: "LICPCC-2015", price: 20}, 
       {name: "LMLHCC-2015", price: 20} 
       ]; 
    $scope.products = gems;     
}); 
app.directive('productTitle', function(){ 
    return { 
    restrict: "E", 
    templateUrl: "product-title.html" 
    }; 
});

为什么我在AngularJs中的指令不起作用？

相关推荐