Question

我有以下代码。

在我的HTML中：

<md-list-item ng-repeat="sidenavelem in sidenavelements">
    <md-button layout="row" layout-align="start center" ng-click="SelectSidevanElements(sidenavelem); Close()" ng-bind-html="sidenavelem.name | to_trusted">a</md-button>
</md-list-item>

<md-content layout="column" flex class="md-padding">
    <div dynamic="sidenavelement.template"></div>
</md-content>

这是指令：

var app = angular.module('StarterApp', ['ngMaterial', 'mdDataTable']);

app.directive('dynamic', function ($compile) {
return {
    restrict: 'A',
    replace: true,
    link: function (scope, ele, attrs) {
        scope.$watch(attrs.dynamic, function(html) {
            ele.html(html);
            $compile(ele.contents())(scope);
        });
    }
};
});

而且，在我的控制器内

$scope.sidenavelement = $scope.sidenavelements[0];
$scope.SelectSidevanElements = function(sidelem) {
    $scope.sidenavelement = sidelem;
};

$scope.sidenavelements = [
{
    name: "Home",
    template: 
    '<div layout-padding flex>' +
    '   <md-data-table table-card="{visible: tableCardIsEnabled}">' +
    '       <md-data-table-header-row>' +
    '           <md-data-table-column align-rule="left">Money</md-data-table-column>' +
    '       </md-data-table-header-row>' +
    '       <md-data-table-row ng-repeat="record in records">' +
    '           <md-data-table-cell>{{record.money}}€</md-data-table-cell>' +
    '       </md-data-table-row>' +
    '   </md-data-table>' +
    '</div>'
},
{
    name: similar above,
    template: similar above
},
{
    name: similar above,
    template: similar
}
];

我的程序如下工作。当我点击md-list-item中的md按钮时，md-content随sidenavelement.template的内容而变化

我有一个简单的函数，可以将元素添加到数组记录中（这些值显示在“主页模板”中。

如果我转到与“home”不同的“模板”并尝试在记录数组中插入一个值，则所有工作都有效，但我有以下错误：

Error link！

有人可以帮助我吗？

谢谢！

编辑：Cloud9 IDE link

Answer 1

您的指令中存在问题，即require: '...'缺失。
阅读更多关于您的问题的here，或了解有关如何创建自定义指令的更多信息，请阅读this。

错误：$ compile：ctreq缺少必需的控制器

1 个答案: