Question

这里我尝试使用angularJs使用自动完成文本框，当我加载我的视图时，它通过错误“未捕获的错误：[$ injector：modulerr]”

** Html Code *

<div ng-controller="ngAutoCompleteController">
    <div angucomplete-alt id="txtAutocomplete" placeholder="Type country name" pause="100"
         selected-object="afterSelectedCountry" local-data="Employees" search-fields="Name"
         title-field="Name" minlength="1" input-class="form-control" match-class="highlight">

    </div>

    <div ng-show="SelectedCountry">
        Selected Country : {{SelectedCountry.Employees}}
    </div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.2/angular.min.js"></script>
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular-resource.min.js"></script>
<link href="~/Content/angucomplete-alt.css" rel="stylesheet" />
<style type="text/css">
    .angucomplete-dropdown {
        overflow-y: auto;
        max-height: 200px;
    }
</style>

Angular.Js

var app = angular.module('myApp', ['angucomplete-alt']);
app.controller('ngAutoCompleteController', ['$scope', '$http', function ($scope, $http) {
    $scope.Employees = [];
    $scope.SelectedCountry = null;


    //After select country event
    $scope.afterSelectedCountry = function (selected) {
        alert('Enter in Control autocom')

        if (selected) {
            $scope.SelectedCountry = selected.originalObject;
        }
    }

    //Populate data from database 
    $http({
        method: 'GET',
        url: '/home/GetCountries'
    }).then(function (data) {
        $scope.Employees = data.data;}]);

mvc controller

 public JsonResult GetCountries(){
var x =( from n in db.Employees orderby n.Name  select n).ToList();return new JsonResult { Data = x, JsonRequestBehavior = JsonRequestBehavior.AllowGet };}

Answer 1

您需要在视图中引用相应的angucomplete-alt.js，

<script src="https://github.com/ghiden/angucomplete-alt/blob/master/angucomplete-alt.js"></script>

Answer 2

在Html页面中，您没有包含对angucomplete-alt.js的引用。下载angucomplete-alt.js.file并在你的html页面中引用它。

<script src="angucomplete-alt.js"></script>

未捕获的错误：[$ injector：modulerr]

2 个答案: