使用Angular指令加载部分不会在第二次加载视图时进行渲染

时间:2015-09-28 21:13:00

标签: javascript angularjs ionic

我正在使用离子框架来推特。我想知道这更像是一个AngularJS,而不是离子问题。

我在主要抽象应用状态下有以下状态。

       app.state('app.a', {
                url: "/a",
                views: {
                    "mainContent": {
                        templateUrl: "app/views/a.html"
                    }
                }

            }).state('app.b', {
                url: "/b",
                views: {
                    "mainContent": {
                        templateUrl: "app/views/b.html"
                    }
                }
            }); 

我有一个指令来加载部分如下。

app.directive('widthLengthLoadSpeed', function () {

    return {
        restrict: 'E',
        scope: {
            id: '=id'
        },
        scope: true,
        templateUrl: 'app/views/partials/width.length.load.speed.htm.html'
    }
})

在a.html上我有一个按钮,它点击一个具有以下代码的函数。

angular
.element(document
  .getElementsByClassName("widthLengthLoadSpeedBeforethis"))
        .prepend(
      $compile('<width-length-load-speed id="StraightRunning_'+$scope.$id+'">
               </width-length-load-speed>')($scope));

    if ($scope.$root.$$phase != '$apply' &&
        $scope.$root.$$phase != '$digest') {
         $scope.$apply();

并在b.html上按钮与代码链接到函数。

angular
    .element(document
      .getElementsByClassName("widthLengthLoadSpeedBeforethis"))
            .prepend(
          $compile('<width-length-load-speed id="circular_'+$scope.$id+'">
                   </width-length-load-speed>')($scope));

        if ($scope.$root.$$phase != '$apply' &&
            $scope.$root.$$phase != '$digest') {
             $scope.$apply();

当我点击a.html上的按钮并转到b.html和反之时,视图会正确加载部分内容。但是,当我返回并单击我在另一页上之后已经存在的页面上的按钮时,视图不会加载部分。虽然我在调试时可以看到元素中的html。我整天都在敲打这个。任何帮助,不胜感激。

1 个答案:

答案 0 :(得分:2)

由于缓存,您的观点相互冲突。

带有cache-view = false属性的

Disable cache

<ion-view cache-view="false" view-title="My Title!">
  ...
</ion-view>