Question

我正在检索所有数据并将其存储在变量“storedata”中，将其显示在与角度控制器相关联的HTML视图“A”中，我正在使用百日咳模板，但是点击了ID我想在另一个HTML视图“B”中显示内容，我想要使用已经拥有数据的变量“storedata”。所以我尝试将HTML视图“B”链接到相同的角度控制器，以为我可以直接访问它，但我不能。你的建议很有价值。所有文件都粘贴在下面。

HTML“A”

    <div data-ng-repeat="storedata in storeDataModel">
       <a  class="clickableRow" title="Click to get User details" onclick="window.open('B.html')" >{{storedata.ID}}
    </a>
</div>

HTML“B”

<div ng-controller="angularController">
<a> HELLO WORLD..!! {{storedata.ID}}</a>
</div>

Answer 1

如果不引导它，则无法加载其他视图。通过调用窗口。打开，您只加载一个与您正在使用的角度应用程序无关的html文件。有关详细信息，请查看angular bootstrapping.

另一种方法是使用ng-route或ui-router。我建议后一个。

例如，请看下面的代码：

＆＃13;

angular.module('app', ['ui.router'])
  .config(function($stateProvider, $urlRouterProvider) {

    // State definition
    $stateProvider
      .state('homeState', {
        abstract: true,
        url: '/home',
        template: '<div> {{ title }} ' +
          '<div ui-view><div>' +
          '</div>',
        controller: 'HomeController'
      })
      .state('homeState.childStateA', {
        url: '/stateA',
        template: '<div> {{ data }} </div>' +
          '<button data-ng-click="$state.go(\'homeState.childStateB\')"> Click Me To GoTo StateB </button>',
        controller: 'StateAController'
      })
      .state('homeState.childStateB', {
        url: '/stateB',
        template: '<div> {{ data }} </div>' +
          '<button data-ng-click="$state.go(\'homeState.childStateA\')"> Click Me To GoTo StateA </button>',
        controller: 'StateBController'
      });

    // Default to stateA
    $urlRouterProvider.otherwise('/home/stateA');
  })
  .run(function($rootScope, $state, $stateParams) {
    $rootScope.$state = $state;
    $rootScope.$stateParams = $stateParams;
  })
  .controller('HomeController', function($scope) {
    // homeState data
    $scope.title = 'State example';
  })
  .controller('StateAController', function($scope) {
    // StateA data
    $scope.data = 'Hi State A';
  })
  .controller('StateBController', function($scope) {
    // StateB data
    $scope.data = 'Hi State B';
  })

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.4.2/angular-ui-router.min.js"></script>

<div data-ng-app="app">
  <div ui-view></div>
</div>

＆＃13;

使用相同的角度控制器onClick将数据从一个HTML传递到另一个HTML

1 个答案: