javascript - 将 html 分解为多个子 html 文件后如何访问 angularjs1 中的变量？

Question

我已将我的主 html 页面分解为几个子页面并将子页面导入到主 html 文件。现在，似乎每个页面都引用不同的“$scope”变量。我需要将 ng-modle="My-model"从一个子页面引用到另一个子页面。可以这样做吗？我的示例代码如下，

搜索-parent.html

<div class="widgets">
  <div class="row accordions-row">
    <div class="col-md-6" include-with-scope="serch.html"></div>
    <div class="col-md-6" include-with-scope="other-search.html"></div>
  </div>
</div>

搜索.html

<div class="col-sm-9">
    <input type="text" class="form-control" ng-model="mymodel">
</div>

其他搜索.html

<div class="col-sm-9">
    <input type="text" class="form-control" ng-model="mymodel">
</div>

Angular 模块配置

(function () {
    'use strict';

    angular.module('my-module', [])
    .config(routeConfig);

    /** @ngInject */
    function routeConfig($stateProvider) {
        $stateProvider
        .state('state1', {
            url: '/search',
            controller: 'ctrl',
            templateUrl: 'search-parent.html',
        });
    }
})();

谢谢!

Answer 1

您可以使用共享服务或广播事件或 $rootScope，也可以为所有子模板维护相同的 Controller 。但使用 $rootScope 并不是一个好方法。

Share data between AngularJS controllers