Question

在名为Window的应用程序组件中，每次需要根据服务返回的值显示不同的HTML。

不同的html文件保存在资产文件夹中。例： -资产/guide1.html -资产/guide2.html -资产/guide3.html ....依此类推。所有这些文件都具有静态内容。

我们为应用程序提供的服务返回文件名。该组件将知道html文件名，并且应该在其模板中加载html。如何实现？

是否可以创建一个组件，其中templateUrl可以是表达式？以下是angularjs的示例代码：

app.directive('headermenu', function() {
  return {
    restrict: 'E',
    scope: {
      userRole : '='
    },
    link: function($scope)
    {
      $scope.$watch('userRole', function(userRole)
      {
        if (userRole && userRole.length)
        {
            $scope.dynamicTemplateUrl = 'assets/common/headerMenu' + userRole + '.html';
        }
      });
    },

    template: '<ng-include src="dynamicTemplateUrl"></ng-include>'
  };
});

此链接中的相同代码：plunker

ng-include是否从资产文件夹加载html？ Angular 7如何实现？

Answer 1

您可以使用HttpClient将文件注入服务的构造函数中，然后再尝试

let path = 'assets/' + {fileName} + '.html';
this._httpClient.get(path, {responseType: "text"}).subscribe(
data => {
//now you have the file content in 'data'
});

有关从服务到html的绑定，您可以参考this question。

角7：从组件内的资产文件夹加载html页面？

1 个答案: