Javascript $scope在视图中未定义，但在控制器中未定义

我有一个

$scope

，需要从国家列表中选择显示iso代码

所以国家列表是通过$http调用工厂获取的，它填充到一个作用域中，到目前为止，这里还不错

///////// get countries ////////////////
tableFactory.getCountries().then(function(data){
  $scope.presentCountries = data;
});

presentCountries

将被发送到

typeahead

中，用户将在其中键入一个国家并选择它，如下所示：

<div class="countrySearchField">
    <div class="row">
        <h3 class="searchTitle">Pick a country</h3>
    </div>
    <input type="text" class="form-control search-input" ng-model="countryPicked" uib-typeahead="presentCountry.name for presentCountry in presentCountries | filter:{name: $viewValue}:startsWith" typeahead-min-length="1" typeahead-on-select="onSelectCountry($item, $model, $label)" typeahead-editable="false"/>
</div>

我可以从console.log在控制台中看到数据，

$scope.brandCountryCode

，但不能在模式视图（覆盖视图）中看到

我在控制器中名为

$scope.test='test'

的函数之外做了一个测试，我在overlay视图中看到了该值。在这种情况下，我有其他基于select函数的作用域，它们都在

$scope

函数下运行

我添加了一个初始值设定项，

$scope.brandCountryCode='

，但它没有做任何事情。如果我能解决这一个，那么其他的就可以了

不知道这是怎么回事，有人有什么建议吗。对于Angular来说还是个新手，我们将非常感谢您的帮助。谢谢

编辑

覆盖模式的完整服务代码：

(function() {
  'use strict';

  angular
  .module('com.xad.se-tools')
  .service('tableModalService', function($scope, $uibModal){

    this.modalInstance = null;
    this.type = null;

    this.openModal = function(type) {
      this.type = type;
      if(type == 'mergeRequest'){
        var templateUrl = 'app/views/dataMerge/overlayMsg.html';
        var backdropClass = 'auth-backdrop';
        var controller = 'tablePageCtrl';
      }

      this.modalInstance = $uibModal.open({
        animation: true,
        templateUrl: templateUrl,
        // controller: 'AuthCtrl',
        controller: controller,
        windowTopClass: 'auth-template',
        backdrop: 'static',
        backdropClass: backdropClass,
        scope: $scope
      });
    };

    this.closeModal = function() {
      this.modalInstance.dismiss('cancel');
    }

  });

})();

---

我认为您应该在模态实例中设置

scope

config选项，以设置模态中使用的范围：

  this.modalInstance = $uibModal.open({
        animation: true,
        templateUrl: templateUrl,
        controller: controller,
        windowTopClass: 'auth-template',
        backdrop: 'static',
        backdropClass: backdropClass,
        scope: $scope
      });

---

有关更多详细信息，请查看angular bootstrap modal documenation。

我认为您应该在模态实例中设置

作用域

配置选项，以设置模态中使用的作用域：

  this.modalInstance = $uibModal.open({
        animation: true,
        templateUrl: templateUrl,
        controller: controller,
        windowTopClass: 'auth-template',
        backdrop: 'static',
        backdropClass: backdropClass,
        scope: $scope
      });

---

请检查角度引导模式文档以了解更多详细信息。

您可能是的受害者。本质上，模态的作用域不同于父页面，并且页面上的值是隐藏的。您可以使用@Bartekfyzowicz提供的答案（强制模态使用相同的作用域），或者遵循angular中的黄金法则：“在角度绑定中始终使用点”。您可能是一个错误的受害者。本质上，模态的作用域不同于父页面，并且页面上的值是隐藏的。您可以使用@Bartekfyzowicz提供的答案（强制模式使用相同的作用域），或者遵循angular中的黄金规则：“始终在角度绑定中使用点。”。我在将作用域添加到服务中时遇到一些问题，我遇到了注入错误。我在问题中添加了代码。@medev21服务无权访问

$scope

对象。无论如何，从一个服务创建一个模式并不是真正正确的

$uibModal

是一项服务，调用一项服务来调用另一项服务会变得混乱。除了@Claies comment之外：您可以直接在控制器中创建模态的实例，您需要在模态中使用哪个作用域。我做了你们在本文中建议的实际工作。谢谢我在将作用域添加到服务中时遇到一些问题，出现注入错误。我在问题中添加了代码。@medev21服务无权访问

$scope

对象。无论如何，从一个服务创建一个模式并不是真正正确的

$uibModal

是一项服务，调用一项服务来调用另一项服务会变得混乱。除了@Claies comment之外：您可以直接在控制器中创建模态的实例，您需要在模态中使用哪个作用域。我做了你们在本文中建议的实际工作。谢谢

(function() {
  'use strict';

  angular
  .module('com.xad.se-tools')
  .service('tableModalService', function($scope, $uibModal){

    this.modalInstance = null;
    this.type = null;

    this.openModal = function(type) {
      this.type = type;
      if(type == 'mergeRequest'){
        var templateUrl = 'app/views/dataMerge/overlayMsg.html';
        var backdropClass = 'auth-backdrop';
        var controller = 'tablePageCtrl';
      }

      this.modalInstance = $uibModal.open({
        animation: true,
        templateUrl: templateUrl,
        // controller: 'AuthCtrl',
        controller: controller,
        windowTopClass: 'auth-template',
        backdrop: 'static',
        backdropClass: backdropClass,
        scope: $scope
      });
    };

    this.closeModal = function() {
      this.modalInstance.dismiss('cancel');
    }

  });

})();

  this.modalInstance = $uibModal.open({
        animation: true,
        templateUrl: templateUrl,
        controller: controller,
        windowTopClass: 'auth-template',
        backdrop: 'static',
        backdropClass: backdropClass,
        scope: $scope
      });