javascript - Angularjs Route中的外部 View html文件

Question

请指教如何包含(使用)几个项目之间常用和共享的 html 文件。因此来自外部服务器的 html 文件需要包含在 Angularjs 路由器中。这是我所拥有的以及我正在尝试解决的问题的简短示例。现在 .html 在我的项目文件夹中:

 .state('chatbase', {
            url: '/cn={cn}',
             onEnter: function ($stateParams, ParamsShareService) {
               ParamsShareService.updateCnValue($stateParams.cn);

            },
            views: {
                'content@': {
                    templateUrl: 'views/chat_wv1.html',
                    controller: 'ChatController'
                }

            }

             })

我正在努力让他们像这样工作。所以我可以分享几个项目的结构。

 .state('chatbase', {
            url: '/cn={cn}',
             onEnter: function ($stateParams, ParamsShareService) {
               ParamsShareService.updateCnValue($stateParams.cn);

            },
            views: {
                'content@': {
                    templateUrl: 'https://my-website/views/chat_wv1.html',
                    controller: 'ChatController'
                }

            }

             })

Answer 1

我认为您实现它的方式行不通。

templateUrl 支持项目或字符串的显式路径。

HTML 是静态文件，内容是静态的。然而从HTTP调用文件意味着使用HTTP协议(protocol)获取文件内容——不同的流程和templateUrl不支持这种方式。

此外，Angular 状态在任何 Controller 之前加载，我相信 templateUrl: 'views/chat_wv1.html', 就是我们今天拥有的。

你可以试试这个方法(但有点复杂):

1) 你可以加载一些teplate.html

views: {
            'content@': {
                templateUrl: 'views/teplate.html',
                controller: 'ChatController'
            }
        }

2) teplate.html 将绑定(bind)到一些将从服务器加载 HTML 内容 的 Controller ，您可以使用 $compile + ng-include实现你想要的