Question

我有app.js文件和watchExample.js文件，它有一个控制器。我正在app.js中将此控制器注入我的应用程序。所以我不想在index.html头部加载watchExample.js文件。因为如果我有很多js文件，我将不得不在我的head标签中加载它们。所以这对我来说似乎很脏。为什么我必须加载我的每个额外的js文件，我已经在app.js中注入它们？或者有更好的方法吗？

的index.html

<!DOCTYPE html>
<html ng-app="watch">
    <head>   
        <title>Angular Watch</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
        <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular-route.min.js"></script>
        <script type="text/javascript" src="app.js"></script>
        <script type="text/javascript" src="watchExample.js"></script>
    </head>
    <body ng-controller="watchExample">
        <div ng-view=""></div>        
    </body>
</html>

app.js

var app = angular.module("watch", ['ngRoute', 'watch-page']);

app.config(function($routeProvider){
    $routeProvider
        .when('/',{
            templateUrl: 'login.html' 
        })
        .when('/watch',{
            resolve: {
                "check": function($location,$rootScope){
                    if(!$rootScope.loggedIn){
                        $location.path('/');
                    }
                }
            },
            templateUrl: 'watch.html',
            controller: 'watchExample'
        })
        .otherwise({
            redirectTo: '/' 
        });    
});

watchExample.js

var app = angular.module("watch-page", []);
app.controller('watchExample', ['$scope', function ($scope) {
        $scope.counter = -1;
        $scope.$watch('myText', function (newValue, oldValue) {
            $scope.counter++;
            if($scope.counter === 50){
                alert("Yeter artık "+$scope.counter+" kere değiştirdin!");                
            }
            $scope.oldVal = oldValue;
            $scope.newVal = newValue;
        });
    }]);

Answer 1

用蹩脚的语言看你只是为了让你明白。

假设有一家杂货店，当你去那里时，你会发现什么？几乎所有的杂货都对吗？现在你想要一些蔬菜，所以你会把它们全部拿走吗？当然没有你会得到你想要的东西。

当你给src =“”然后整个js文件“REMEBER JS FILE和它的源代码”被加载到你的html应用程序中，现在你想要内部的东西。例如一些function（），你将调用function_name（）或src =“”..

所以src只是加载页面中的所有数据，而注入只是用来从文件中获取函数。

对你来说另一个问题“更好的方法”是使用gulp。

https://scotch.io/tutorials/automate-your-tasks-easily-with-gulp-js

gulp做的是将所有js文件合并为一个（这是其中一个功能）

AngularJS包括部分js文件而不在HTML头中加载

1 个答案: