Question

范围变量未通过ng-include标记传递给模板。我希望generic.html页面附带page1.html和page2.html。我正在获取静态内容嗨，欢迎这样但当我在controller1.js中单击一个方法时，angular指令中包含的名称没有被打印。我尝试在$ scope.user = {}之类的对象中命名，并添加了user.name，然后我也无法在html模板中绑定名称。

Main.js

 $stateProvider
        .state('index', {
            parent: 'app',
            abstract : true,
            url: '/index',
            views: {
                'content@': {
                    templateUrl: urlpath+'ngtemplates/chat/chat.menu.html',
                    controller: ['$state',function ($state) {
                      $state.go('screen.welcome');
                    }]
                }
            }
        })
        .state('screen.welcome', {
            url: '',
                    templateUrl: urlpath+'templates/page1.html',
                    controller:'Controller1'
        })
        .state('screen.details', {
            url: '',
                    templateUrl: urlpath+'templates/page2.html',
                    controller:'Controller2'
        })

Controller1.js

$scope.selected = function(){
$scope.name = "Jim";
}

generic.html

<div ng-app="sampleapp">
<h1> Hi, Welcome! </h1>
<p> {{name}} </p>
</div>

Answer 1

您需要将控制器添加到模板

   <div ng-app="sampleapp">
     <div ng-controller = "Controller1"> //controller added 
        <h1> Hi, Welcome! </h1>
        <p> {{name}} </p>
    </div>
        </div>

Answer 2

您还可以使用controllerAs语法。

.state('screen.details', {
        url: '',
                templateUrl: urlpath+'templates/page2.html',
                controllerAs:'vm'
    })

在Html中，您可以访问{{vm.name}}。

请注意，如果您使用ControllerAs语法，则无需在HTML中添加ng-controller。

范围变量未传递给使用ng-include包含的模板

2 个答案: