javascript - AngularJS 创建指令以使用正确的基本 url 扩展 ng-include

Question

因此，由于我工作中的限制，我收到了一些相当长的内容。为了避免这种情况，我尝试创建以下指令:

app.directive('viewInclude', [function() {
        var baseUrl = 'fams360frontend/views/default/glap';
        return {
            scope: {
                viewInclude: '@'
            },
            template: '<div ng-include="link"></div>',
            link: function($scope) {
              $scope.link = baseUrl + $scope.viewInclude;                  
            }
        };
    }]);

然后我这样调用它:

<view-include src="'/partials/ientry-header.html'"></view-include>      

我对 Angular 还很陌生，所以这可能是一个简单的问题，但我似乎无法弄清楚我哪里出了问题。我在渲染时收到此错误:

Error: [$parse:syntax] <!-- ngInclude: fams360frontend/views/default/glap{{viewInclude}} -->

编辑:

我已经使用下面的答案更新了我的代码，但我现在不再获得银行绑定(bind)......有什么想法吗？

包含的文件:

<div style="display: inline-block;">
    <div style="display: inline-block;">
        <span>Bank Account:</span>
    </div>
    <div style="display: inline-block; margin-left: 10px;">
        <span>{{bank.bank_number}} - {{bank.account_name}}</span>
    </div>
</div>
<div style="display: inline-block; margin-left: 75px;">
    <div style="display: inline-block;">
        <span>Company:</span>
    </div>
    <div style="display: inline-block; margin-left: 10px;">
        <span>{{bank.company_number}} - {{bank.company_name}}</span>
    </div>
</div>

Answer 1

添加链接函数并连接。

app.directive('viewInclude', [function() {
    var baseUrl = 'fams360frontend/views/default/glap';
    return {
        replace: true,
        scope: {
            viewInclude: '@'
        },
        template: '<div ng-include="link"></div>',
        link: function($scope) {
          $scope.link = baseUrl + $scope.viewInclude;                  
        }
    };
}]);

另外。我相信你的 html 需要是。

<div view-include="asdf"></div> <!-- view-include should be an attribute. And since you're using `@` you don't need to wrap the string in single quotes -->