4

给定控制器

function ctl($scope, $http) {
  $scope.postForm = function() {
    console.log("submitting form")
  }
}

和视图

  <form name="pform" ng-show="!error.Show">
    <div ng-view></div>
    <button type='button' value='Save' ng-click="postForm()" />
  </form>

控制器方法postForm不会被调用，但是，如果我将表单标签移动到视图中，则会调用该方法。有没有理由不能像我预期的那样工作？是否有另一种方法来实现跨不同视图共享表单控件的目标？

更新

我的模块和 routeProvider 配置如下：

angular.module("profilemodule", [])
.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
        .when("/info", { templateUrl: '/partials/profile/info.html', controller: ProfileController })
        .when("/user", { templateUrl: '/partials/profile/user.html', controller: ProfileController })
        .when("/introduction", { templateUrl: '/partials/profile/editor.html', controller: ProfileController })
        .otherwise({ redirectTo: '/info' });
}]).run(function ($rootScope, $location) {
    $rootScope.location = $location;
})

该页面包含一些基于位置服务设置的导航元素，如下所示：

<div class="row">
    <div class="offset2 span10">
        <ul class="nav nav-pills">
            <li ng-class="{active: location.$$path.substring(0, '/info'.length) == '/info'}"><a href="#/info" >Information</a></li>
            <li ng-class="{active: location.$$path.substring(0, '/user'.length) == '/user'}"><a href="#/user" >User</a></li>
            <li ng-class="{active: location.$$path.substring(0, '/intro'.length) == '/intro'}"><a href="#/intro" >Introduction</a></li>
        </ul>
    </div>
</div>

<form name="pform" method="POST" ng-show="!error.Show">
   <div ng-view></div>
   <button type='button' value='Save' ng-click="postForm()" />
</form>

ng-class语句完美运行，是因为我在模块的方法中设置了属性吗location？$scoperun

谢谢，

杰森

4

1 回答 1

1

ng-viewwith routing 使用控制器创建一个新范围，并且您无法到达子范围。您的提交操作位于父范围内，表单数据位于子范围内（由 创建ng-view）。

如果你想使用常见的表单控件，你可以使用，这个指令获取模板并在当前范围内ng-include呈现它。

将表单控件移至新模板，然后将它们包含在所有表单中。

API 参考：
http ://docs.angularjs.org/api/ng.directive:ngInclude

于 2013-01-20T14:50:02.090 回答