Question

我有以下html文件： -

 <!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>

在这里我有一个名为first-tag的元素指令。

以下是我的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>

我想在表格中打印上述内容。

Answer 1

我认为应该是：

<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>

角度指令

1 个答案: