4

我正在处理的网站有一个自定义 CMS,我正在使用 angularjs 进行内联页面编辑。数据库存储用于生成页面的 HTML,因此我不能严格使用客户端模板和模型。

我没有使用 HTML5 pushState,因此 URL 类似于example.com/page#/widget/1/editexample.com/page#/widget/new,而我当前的问题是当我提交要编辑的表单时一个小部件或添加一个小部件,然后我希望页面通过将 HTML 注入 DOM 并将 URL 更改为默认值来重新加载其内容,我正在尝试使用$location.path('/').

我当前的实现有多个问题(您将在演示中看到),其中一个是在我的表单submit()回调中,正在更改$location.path只会更改第二个表单按钮单击时的 URL。我还尝试更改单击“删除”的 URL,但这也不起作用。

http://jsfiddle.net/sZrer/1

customPage.controller('PageEditCtrl', function($scope, $http, $routeParams, $location, $route, $compile, PageState) {
    var widgetId = $routeParams.id || widgetCount + 1;

    $scope.pageState = PageState;
    $scope.widget = { id: widgetId, name: 'Widget ' + widgetId };
    $scope.submit = function() {
      if ($scope.widget.id > widgetCount) widgetCount += 1;
      setTimeout(function() {
        var element = $compile(genHtml())($scope);
        angular.element('#page-content').html(element);
        $location.path('/');
      }, 100);
    };
  });
4

1 回答 1

8

setTimeout()不能很好地与 Angular 混合(Angular 使用一个事件循环来检查模型的更改,但要能够做到这一点,它必须能够控制应用程序的所有部分;setTimeout()它超出了 Angular 的控制范围,并且当在 -handler 中对应用程序的 Angular 部分进行任何更改时setTimeout,通常需要再进行 Angular 事件循环的“一轮”才能获取这些更改)。

如果你用 Angular 自己的替换它$timeout()(确保也注入它),它会更好地工作(jsfiddle)。

于 2013-07-20T15:58:55.467 回答