Question

是否可以在没有templateURL的情况下使用Angularjs的路由和控制器？

例如，下面是我当前的路线，控制器和模板网址，

return app.config(['$routeProvider', function ($routeProvider) {
        $routeProvider
        .when("/",
        {
            templateUrl: "js/template/1.html",
            controller: "controller1"
        })
        .when("/list1",
        {
            templateUrl: "js/template/2.html",
            controller: "controller2"
        })
...

我的html中有ng-view，

<div ng-view></div>

我使用没有templateUrl，

的路线进行了测试

return app.config(['$routeProvider', function ($routeProvider) {
            $routeProvider
            .when("/",
            {
                //templateUrl: "js/template/1.html",
                controller: "controller1"
            })
            .when("/view1",
            {
                //templateUrl: "js/template/2.html",
                controller: "controller2"
            })
    ...

结果 - 我的屏幕上没有显示任何内容。显然控制器不能再被触发了。

Answer 1

Angular使用$ routeProvider定义将控制器附加到视图。如果你不想在$ routeProvider配置中指定细节，其他选项是让应用程序使用类似的东西登陆一个页面 -

  .config(function ($routeProvider) {
$routeProvider
  .when('/', {
    templateUrl: 'views/main.html'
  })
    .when()
    .otherwise({
    redirectTo: '/'
  });

}）;

这样用户将登陆main.html。现在在main.html上，你可以包含几个不同的html模板，如 -

 <div ng-include src="'js/template/1.html'" ng-controller = 'Controller1'></div>
 <div ng-include src="'js/template/2.html'" ng-controller = 'Controller2'></div>

请注意上面使用/包含模板的语法 - "'<<Path>>'"

希望这有帮助。

Answer 2

使用带空字符串的模板。

return app.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
    .when("/",
    {
        template: "",
        controller: "controller1"
    })

Answer 3

使用空字符串设置模板会出错并导致递归加载；我通过添加空html文件的链接来解决它。

 return app.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
    .when("/",
    {
       template: "dummy.htm",
       controller: "controller1"
    })

Angularjs：没有templateURL的路由和控制器？

3 个答案: