从推送页面通过 <ons-back-button> 弹出页面后未加载父控制器模块

Question

这是我的第一个问题，所以我害怕自己是个傻瓜，但我之前做了很多研究，并花了很多时间试图通过更改代码来解决这个问题。我对网络应用程序编程比较陌生，可能缺少一些可能阻碍我前进的概念知识。

环境和工具：使用 cordova、onsen ui、Android studio、angularjs 在我的专业领域开发一种工程师计算器，我不是专业人士程序员.

该应用程序基于如下用户 data/page 流程中连接的一系列页面，除了我寻求帮助的问题外，该应用程序运行正常。

（我还不能 post 图片）

数据流是这样的：

menu.html >> page1.html >> load.html

对于每个 html 页面视图，我都有一个控制器模块，所有模块都在同一个控制器文件中。例如，index.html 中定义的滑动菜单调用 page1.html，这是唯一具有 SVG 图形的页面，而不是通过 onclick 推送页面链接到 load.html 页面。请参阅下面的页面代码：

menu.html

<body onload="onLoad()" ng-app="calcfcc" ng-controller="calcfccController">

<!-- to transfer to AS start here -->

<ons-sliding-menu
        menu-page="menu.html" main-page="page1.html" side="left"
        var="menu" type="reveal" max-slide-distance="200px" swipable="true">
</ons-sliding-menu>

<!-- sliding-menu - Menu list here!!! -->

<ons-template id="menu.html">
    <ons-page modifier="menu-page">
        <ons-toolbar modifier="transparent"></ons-toolbar>

        <ons-list class="menu-list">

            <ons-list-item class="menu-item" ng-click="menu.setMainPage('page1.html', {closeMenu: true})">
                <ons-icon icon="fa-home"></ons-icon>
                {{menu1}}
            </ons-list-item>

page1.html 从幻灯片菜单调用：

<ons-navigator animation="slide" var="page1navi">
<ons-page ng-controller="initController" on-device-backbutton="backbuttonpage()" style="background: #001a00;">




    <ons-toolbar fixed-style>
        <div class="left">
            <ons-toolbar-button id="popoverb1" ng-click="menu.toggle()">
                <ons-icon icon="ion-navicon" size="28px" fixed-width="false"></ons-icon>
            </ons-toolbar-button>
        </div>
        <div class="center">
            {{pageheader1}}
        </div>
        <div class="right" style="padding: 7px;">
                <img src="img/AASis78x31branco.png" alt="AASis" >
        </div>
    </ons-toolbar>

page1.html 从可点击的 SVG 图标调用 load.html 的部分：

<g
                id="g4533"
                onclick="page1navi.pushPage('load.html', { animation : 'slide' } )"
                transform="translate(0,-66.958368)">
            <rect
                    style="color:#000000;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;fill:url(#linearGradient4485);fill-opacity:1;fill-rule:evenodd;stroke:#6e6e6e;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
                    id="rect10449"
                    width="60"
                    height="60"
                    x="275.33713"
                    y="786.85248"
                    rx="6.7857499"
                    ry="6.3835001" />

load.html 页数：

<ons-page ng-controller="loadController">
<ons-toolbar>
    <div class="left"><ons-back-button>{{about1}}</ons-back-button></div>
</ons-toolbar>



<p class="textarea" style="font-size: 20px; border: 2px solid #0066FF; margin: 5px">
    {{load1}}
</p>

所以我的问题是 page1.html 控制器加载正常，load.html 控制器也加载正常并正常工作，但是当按下 load.html 页面时 "back" return 到 page1.html 的按钮未加载 page1 控制器，我无法使用在 load.html.

上操作的数据刷新视图

这与全局变量无关，只是没有加载正确的控制器。

当从 index.html 调用 page1.html 时它起作用了，但我可以要求用户返回侧面菜单只是为了刷新。另外重新加载全部不是一个选项，对用户来说非常烦人。

知道如何解决这个问题吗？

TKS 进阶!!!!

Answer 1

创建页面时，控制器仅运行一次。当您使用后退按钮时，您正在破坏 load.html 并返回到 page1.html，但是这个按钮已经在页面堆栈中创建，因此不会再次调用它的控制器。此外，AngularJS 只会识别在 Angular 范围内完成的更改。否则你将需要使用 $scope.$apply() to let Angular know about the changes. You could use $scope.$apply() on Onsen UI's postpop event.

无论如何，如果你使用 AngularJS，我认为你应该使用 ng-click 而不是 onclick。此外，您可以将文本区域绑定到一个范围变量 using ng-model，这样您在视图中所做的每个更改都会自动存储。我觉得这两个改动应该就够了。

希望对您有所帮助！

从推送页面通过 <ons-back-button> 弹出页面后未加载父控制器模块

Parent controller module is not loaded after pop page through <ons-back-button> from a pushed page

onsen-ui