从服务调用组件

Question

我正在尝试从正在注入的服务中调用组件，该组件位于控制器中 - main_controller.js

我在同一个文件夹中有 main.html。 “/app/abc”

<li ng-click="$ctrl.openUpload()">Upload</li>

这是控制器中的代码。

function MainCtrl($window, $cookies, $stateParams, $state, 
    modalService, $q) {

     var modal = modalService.open({
            size: 'upload',
            backdrop: 'static',
            component: 'assetUpload',
            resolve: {
                saveMsg: function () {
                    return 'Uploading…';
                },
                isModal: true,
                isReady: function () {
                    return function () {
                        return renderedPromise;
                    };
                },
                onCancel: function () {
                    return function (ctrl) {
                        ctrl.modalInstance.dismiss();
                    };
                }
            }
        });
 }

我的组件在“/app/component/_asset_upload/”文件夹中。

当我从控制器调用上传功能时，它给我一个错误， "/abc/app/components/_asset_upload/asset_upload.html" 404（未找到）

我不明白为什么它查看 "abc" 文件夹（与控制器相同的文件夹）中的组件而不是查看“/app/components/_asset_upload/”文件夹。

我怎样才能使代码更好。即使它是不同的体系结构，也请提供帮助。谢谢

Answer 1

定义组件时，您必须像这样设置 templateUrl

templateUrl : 'app/components/_asset_upload/asset_upload.html'

这将从当前文件夹中搜索您的 HTML，因此将其更改为

templateUrl : '/app/components/_asset_upload/asset_upload.html'

这将从应用根目录搜索您的HTML。

从服务调用组件

Call component from a service

angularjs

angular-components

angular-controller

angularjs-1.6