Question

我正在使用ui-router的版本v1.0.0-rc.1和带有组件的角1.6.4。

是应用程序路由的简化版本。每个视图都与一个组件相关联。 topbar，sidebar和pageContent都是组件。

代码在主视图下方的方式不是使用pageContent组件注入的，并且没有错误或警告。但是顶杆和侧边栏都被注入了。

用于复制它的Plunker链接：https://plnkr.co/edit/NedgoYEjkAxaRXRJHSoL?p=preview

    // Application routes
    $stateProvider
        .state('root', {
            url: '',
            abstract: true,
            views: {
                topbar: 'topbar',
                sidebar: 'sidebar'
            }
        })
        //children of the 'root' route
        .state('income', {
            url: '/income',
            parent: 'root',
            views: {
                main: 'pageContent'
            },
            resolve: {
                selectedModule: function () {
                    return 'income';
                }
            }
        })
        .state('outcome', {
            url: '/outcome',
            parent: 'root',
            views: {
                main: 'pageContent'
            },
            resolve: {
                selectedModule: function () {
                    return 'outcome';
                }
            }
        });

这是index.html

<ui-view name="topbar"></ui-view>
<div id="wrapper">
    <ui-view name="sidebar"></ui-view>
    <ui-view name="main"></ui-view>
</div>

pageContent.js

(function () {
    'use strict';

    angular.module('up').component('pageContent', {
        templateUrl: 'app/shared-components/page-content/page-content.component.html',
        controller: Controller,
        bindings: {
            selectedModule: '<'
        }
    });

    function Controller() {}

})();

pageContent.html（包括其他组件）

<div id="page-content-wrapper">
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12 no-padding">
                <sidemenu></sidemenu>
                <operations></operations>
                <reports></reports>
            </div>
        </div>
    </div>
</div>

最后，如果我将'root'路由更改为:(使用主视图和空模板URL）

.state('root', {
     url: '',
     abstract: true,
     views: {
        topbar: 'topbar',
        sidebar: 'sidebar',
        main: {
            templateUrl: ''
        }
    }
})

然后我得到警告：尝试多次加载角度，但一切正常，这意味着所有视图都被注入。

另一件事是，如果删除jQuery，则不会显示上面的警告。但是，我需要jQuery将它与angular.element一起使用

很抱歉这篇文章很长，但我必须提供所有细节。

Answer 1

通常with open('/Users/Jonathan/Desktop/test.png', 'rb') as f: client.action(schema, ['incidents', 'create'], params={ 'file': utils.File('test.png', f) }, encoding="multipart/form-data")标签不会在模板中解析，这是jqLite实现中的一种简化，它是设计存在的。正如this answer中所解释的那样，在Angular之前加载jQuery并使用jQuery替换jqLite并允许动态添加<script>个节点。

插件中出现的问题是由这段代码中的<script>引起的：

templateUrl: ''

这导致将索引页面加载为模板，向DOM添加重复的.state('root', { url: '', abstract: true, views: { topbar: 'topbar', sidebar: 'sidebar', main: { templateUrl: '' } } })标记并对其进行评估。如果<script>视图没有组件，则不应该在main。

关于预期的行为，视图不遵循naming scheme，它可能应该是：

views

查看未注入或警告：尝试多次加载角度

1 个答案: