控制器中的功能未被击中

Question

第一次问问题，所以如果我做错了什么，请告诉我，这样我就可以修复它，因为我已经尝试在这里找到答案，但是找不到，所以任何和所有的帮助都会很大赞赏。

我正在尝试使用控制器加载 "Countries" 的列表，一切似乎都很顺利，没有错误，没有警告，它加载模块并点击 angular 控制器，但它永远不会将 function/goes 打到控制器功能内的代码中。我错过了什么吗？我做错了什么吗？

Register.cshtml

<div ng-app="RegisterApp" class="form-group" ng-controller="CountriesController as CountriesCtrl">
    <label class="input-desc">Country</label>
    <select ng-model="country" 
      ng-options="country.Id as country.Name for country in countries">
        <option value="{{CountriesCtrl.country.Id}}">{{CountriesCtrl.country.Name}}</option>
    </select>
</div><!-- End .from-group -->

RegisterApp.js

var app = angular.module("RegisterApp", []);

CountriesService.js

/// <reference path="../App.js" />

angular.module("RegisterApp").service("CountriesService", function ($http) {
    this.getCountries = function () {
        return $http({
            method: "Get",
            url: "/Account/GetCountries"
        });
    };
});

CountriesController.js

/// <reference path="../Services/CountriesService.js" />

angular.module("RegisterApp").controller("CountriesController", function ($scope, CountriesService) {
    getCountries();

    function getCountries() {
        CountriesService.getCountries()
            .success(function (data, status, headers, config) {
            $scope.countries = data;
            $scope.country = $scope.countries[0];
        })
            .error(function (data, status, headers, config) {
            $scope.message = 'Unexpected Error';
        });
    }
});

编辑：移动了 ng-app，被错误地复制过来，是我在发布 q 之前所做的更改，只是为了尝试一些事情，对此感到抱歉

Answer 1

您的代码必须是：

<div ng-app="RegisterApp">
   <!-- some beautiful html -->
   <div class="form-group" ng-controller="CountriesController as CountriesCtrl">
        <label class="input-desc">Country</label>
        <select ng-model="country" ng-options="country.Id as country.Name for country in countries">
            <option value="{{CountriesCtrl.country.Id}}">{{CountriesCtrl.country.Name}}</option>
        </select>
    </div>
    <!-- some beautiful html -->
</div>

注意 ngApp 指令的用法。

此外，检查是否正确注入了所有依赖项（我的意思是 <head> 块）

Answer 2

ng-app 必须在 ng-controller 之前注册（或在同一元素上）。您已将其注册到具有 ng-controller

的元素的子元素 (select) 中

将您的 HTML 更改为：

<div ng-app="RegisterApp" class="form-group" ng-controller="CountriesController as CountriesCtrl">
    <label class="input-desc">Country</label>
    <select ng-model="country" 
      ng-options="country.Id as country.Name for country in countries">
        <option value="{{CountriesCtrl.country.Id}}">{{CountriesCtrl.country.Name}}</option>
    </select>
</div>

看看 this JSFiddle。

控制器中的功能未被击中

Function in Controller not being hit

html

javascript

angularjs

angularjs-controller