2015-10-11 54 views
0

我有以下的HTML文件: -模板URL文件中的聲明

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
<meta charset="UTF-8"> 
<title></title> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.5/angular.min.js"></script> 
<script src="first.js"></script> 
<link rel="stylesheet" href="list.css"> 
</head> 
<body class="body" ng-app="myApp" ng-controller="FirstController as ctrl"> 
<div> 
    <input type="text" ng-model="inputText"> 
</div> 
<first-tag></first-tag> 

</body> 
</html> 

在此我有稱爲第一標籤的元素指令。

以下是我的js文件: -

var app=angular.module('myApp',[]); 
app.controller('FirstController',function($http){ 
var self=this; 
$http.get("data.json").success(function(response){ 

    self.data=response.records; 
}) 

}) 


app.directive('firstTag',function(){ 
return{ 
    restrict:'E', 
    replace:true, 
    templateUrl:'template.html', 
    controller:'FirstController', 
    controllerAs:'ctrl' 

} 
}) 

在我的指導我已經宣佈template.html作爲templateURL。有人能告訴我爲什麼下面的內容在代碼中無法正常工作?

<table> 
<div class="myClass" ng-repeat="message in ctrl.data | filter: inputText"> 
     <tr> 
     <td><p>Name:{{message.modelName}}</p></td> 
     <td><p>Brand:{{message.modelBrand }}</p></td> 
     <td><img src="{{message.imageUrl}}" width="auto" height="auto"></td> 
     </tr> 
</div> 
</table> 

繼不過似乎是工作的罰款: -

<div class="myClass" ng-repeat="message in ctrl.data | filter: inputText"> 
     <p>Name:{{message.modelName}}</p> 
     <p>Brand:{{message.modelBrand }}</p> 
     <img src="{{message.imageUrl}}" width="auto" height="auto"> 
</div> 

我想打印在上面的表格內容。

回答

0

我覺得應該是:

<table> 
    <tr class="myClass" ng-repeat="message in ctrl.data | filter: inputText"> 
    <td><p>Name:{{message.modelName}}</p></td> 
    <td><p>Brand:{{message.modelBrand }}</p></td> 
    <td><img ng-src="{{message.imageUrl}}" width="auto" height="auto"></td> 
    </tr> 
</table>