Question

基本上我试图在Angular页面中填充表格行作为手风琴标题：

   <div uib-accordion-group ng-repeat="deployment in deployments" is-open="deployment.isOpen">
      <uib-accordion-heading>
        <status-Table deploy="{{deployment}}"></status-Table>
      </uib-accordion-heading>
   </div>

我似乎找不到从部署对象中插入的方法，一旦我将它传递给statusTable指令，然后使用这些变量填充HTML：

app.directive('statusTable', function(){
  return {
    restrict: "E",
    scope: {
      deploy: '@'
    },
    link: function(scope, element, attrs){
      element.html("<table class='table table-hover'>"+
                  "<tr>"+
                  "<td>{{ attrs.deploy.deployment_name }}</td>"+
                  "<td>{{ attrs.deply.region }}</td>"+
                  "<td>{{ attrs.deploy.start_date }}</td>"+
                  "<td>{{ attrs.deploy.deployment_date }}</td>"+
                  "<td><i class='material-icons 
green'>check_circle</i></td>"+
                  "</tr>"+
                  "</table>");
    }
  };

Answer 1

你应该使用＆＃39; =＆＃39;当包括＆部署＆＃39;进入你的范围＆＃39;。

Exit status: -100. Diagnostics: Container released on a *lost* node

＆＃39; =＆＃39;用于双向绑定。像这样更改你的HTML：

scope: {
      deploy: '='
    }

另一种方法是先将对象拉入链接功能：

 <status-Table deploy="deployment"></status-Table>

Answer 2

1.使用deployment

播放=

2.使用template代替html

<status-Table deploy="deployment"></status-Table>

app.directive('statusTable', function(){
  return {
    restrict: "E",
    scope: {
      deploy: '='
    },
    template: "<table class='table table-hover'>"+
                  "<tr>"+
                  "<td>{{ deploy.deployment_name }}</td>"+
                  "<td>{{ deploy.region }}</td>"+
                  "<td>{{ deploy.start_date }}</td>"+
                  "<td>{{ deploy.deployment_date }}</td>"+
                  "<td><i class='material-icons 
green'>check_circle</i></td>"+
                  "</tr>"+
                "</table>"
    }
  };

如何在Angular Directive的链接功能中插入html？

2 个答案: