个人中心
gpt4 book ai didi

javascript - Angular $注入(inject)器:modulerr Module Error

转载 作者：行者123 更新时间：2023-11-27 23:17:39 25 4
gpt4 key购买 nike

我不知道是什么原因导致这个错误:Click to see the error

我正在尝试创建一个动态 Web 应用程序。我是否需要本地服务器来运行此应用程序？目前我没有使用任何本地服务器。

HTML:

<div class = "body" ng-controller = "app">
  <div class = "column2">
    <div class = "sectionName">
       <span class = "sectionName-Span">{{ page.title() }}</span>
       <div class = "container">
          <ng-view>Something went wrong</ng-view>
       </div>
    </div>
  </div>
  <script type=text/ng-template id=profile.html>
     I'm Lalinda Sampath Dias
  </script>

Controller .js:

var application = angular.module('mainApp', ['appServices'])
    .config(['$routeProvider', function($routeProvider) {
        $routeProvider.
                when('/tab1', {templateUrl: 'profile.html',   controller: HomeCtrl}).
                when('/tab2', {templateUrl: 'list.html',   controller: ListCtrl}).
                otherwise({redirectTo: '/tab1'});
}]);


/* Controllers */

function MainCtrl($scope, Page) {
    console.log(Page);
    $scope.page= Page; 
}

function HomeCtrl($scope, Page) {
    Page.setTitle("Welcome");
}


function ListCtrl($scope, Page, Model) {
    Page.setTitle("Items");
    $scope.items = Model.notes();

}

function DetailCtrl($scope, Page, Model, $routeParams, $location) {
    Page.setTitle("Detail");
    var id = $scope.itemId = $routeParams.itemId;
    $scope.item = Model.get(id);
}

function SettingsCtrl($scope, Page) {
    Page.setTitle("Settings");
}

/* Services */

angular.module('appServices', [])

        .factory('Page', function($rootScope){
            var pageTitle = "Untitled";
            return {
                title:function(){
                    return pageTitle;
                },
                setTitle:function(newTitle){
                    pageTitle = newTitle;
                }
            }
        })

        .factory ('Model', function () {
            var data = [
                {id:0, title:'Doh', detail:"A dear. A female dear."},
                {id:1, title:'Re', detail:"A drop of golden sun."},
                {id:2, title:'Me', detail:"A name I call myself."},
                {id:3, title:'Fa', detail:"A long, long way to run."},
                {id:4, title:'So', detail:"A needle pulling thread."},
                {id:5, title:'La', detail:"A note to follow So."},
                {id:6, title:'Tee', detail:"A drink with jam and bread."}
            ];
            return {
                notes:function () {
                    return data;
                },
                get:function(id){
                  return data[id];
                },
                add:function (note) {
                    var currentIndex = data.length;
                    data.push({
                        id:currentIndex, title:note.title, detail:note.detail
                    });
                },
                delete:function (id) {
                    var oldNotes = data;
                    data = [];
                    angular.forEach(oldNotes, function (note) {
                        if (note.id !== id) data.push(note);
                    });
                }
            }
});

编辑:

<body ng-app = "mainApp">
        <div id = "background-div">
            <div class = "header">
                <div class = "ham-icon">
                    <img src = "images/ham-icon.png">
                </div>
                <div class = "logo">
                    <span class = "google-logo">Lalinda</span><span class = "hangouts-logo"> Sampath</span>
                </div>
                <div class = "profile-data">
                </div>
            </div>
            <div class = "body" ng-controller = "app">
                <div class = "column1">
                    <div class = "tab1">
                        <a href = "#/tab1"><img src = "images/people-icon.png"></a>
                    </div>
                    <div class = "tab2">
                        <a href = "#/tab2"><img src = "images/chat-icon.png"></a>
                    </div>
                    <div class = "tab3">
                        <a href = "#/tab3"><img src = "images/phone-icon.png"></a>
                    </div>
                    <div class = "tab4">
                        <a href= "#/tab4"><img src = "images/other-icon.png"></a>
                    </div>
                </div>
                <div class = "column2">
                    <div class = "sectionName">
                        <span class = "sectionName-Span">{{ page.title() }}</span>
                        <div class = "container">
                            <ng-view>Something went wrong</ng-view>
                            <!--input type = "text" ng-model = "name"-->
                        </div>
                    </div>
                </div>
                <script type=text/ng-template id=profile.html>
                    I'm Lalinda Sampath Dias
                </script>
                <div class = "column3">
                    <div classs = "user-greet">
                        <span class = "user-greet-span">Hi, Guest</span>
                    </div>
                    <div class = "det">
                        <span class = "det-span">Get started by calling or messaging a friend below</span>
                    </div>
                    <div class = "functional-area">
                        <div class = "video-call">
                        </div>
                        <div class = "phone-call">
                        </div>
                        <div class = "message">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </body>

最佳答案

您需要添加 ngRoute 作为这样的依赖项

var application = angular.module('mainApp', ['ngRoute','appServices'])

关于javascript - Angular $注入(inject)器:modulerr Module Error，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35694723/

25 4 0
文章推荐： html - 标题文本在移动设备上被截断
文章推荐： css - 在 React 中动画 div(进入和退出)
文章推荐： c++ - cout 不命名类型
文章推荐： javascript - 如何在 JavaScript/Ajax 调用中从 HTML 获取变量
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com