AngularJS Bootstrap Typeahead 플러그인을 사용하고 있습니다. 내 페이지를로드하려고 할 때마다 페이지가 지속적으로로드되기 시작합니다.AngularJS 웹 페이지, 연속 로딩

HTML :

<!DOCTYPE html> 
<html ng-app="myApp"> 
    <head> 
    <script src="angular.js"></script> 
    <script src="ui-bootstrap-tpls-0.11.0.min.js"></script> 
    <script src="example.js"></script> 
    <link href="bootstrap.min.css" rel="stylesheet"> 
    </head> 
    <body> 

    <script type="text/ng-template" id="customTemplate.html"> 
     <a> 
      <img ng-src="{{match.model.favicon}}" width="16"> 
      <span bind-html-unsafe="match.label | typeaheadHighlight:query"></span> 
     </a> 
    </script> 
    <div class='container-fluid' ng-controller="SearchBarCtrl"> 
     <input type="text" ng-model="customSelected" placeholder="Custom template" typeahead="searchItem as searchItem.name for searchItem in searchList | filter:{name:$viewValue}" typeahead-template-url="customTemplate.html" class="form-control"> 
    </div> 
    </body> 
</html>

JS :

angular.module('myApp', ['ui.bootstrap']); 
function SearchBarCtrl($scope) { 
    $scope.selected = undefined; 
    var searchList = { 
    "list":{ 
     "Channel":[ 
     "Tech", 
     "Gaming", 
     "Design" 
     ], 
     "Category":[ 
     "Tech", 
     "Gaming", 
     "Design" 
     ] 
    } 
    }; 
    var channels = searchList.list.Channel; 
    var categories = searchList.list.Category; 
    $scope.searchList = []; 
    for(var i = 0; i < (channels.length > categories.length) ? channels.length : categories.length; i++) { 
    if(typeof channels[i] != 'undefined') 
     $scope.searchList.push({'name':channels[i],'favicon':'img/techcrunch.ico'}); 
    if(typeof categories[i] !== 'undefined') 
     $scope.searchList.push({'name':categories[i],'favicon':'img/techcrunch.ico'}); 
    } 
}

무슨 일이 일어나고 무엇 : 이것은 내가 사용하고 코드입니다

내가 저장 한 모든 스크립트 및 같은 디렉토리에있는 CSS 파일을 XAMPP 서버를 통해 실행합니다. 웹 페이지를 열려고 할 때마다 상태 표시 줄에 페이지가 계속해서 가끔 Chrome에 표시되며 Waiting for plus.google.com 또는 Waiting for www.google.com.pk 및 이와 유사한 관계없는 URL이 표시됩니다.

발생해야 일 : AngularJS와 부트 스트랩 선행 입력 플러그인을 구현해야하는 나타납니다

텍스트 상자. 꽤 많이, 페이지가로드되어야합니다.

출처

2014-07-16 Mohammad Areeb Siddiqui

문제는 for 루프에 있습니다. 대신 당신은 무슨, 대신를 사용합니다!

for (var i = 0; i < length; i++) { 
     if (channels[i] !== undefined) 
      $scope.searchList.push({ 'name': channels[i], 'favicon': 'img/techcrunch.ico' }); 
     if (categories[i] !== undefined) 
      $scope.searchList.push({ 'name': categories[i], 'favicon': 'img/techcrunch.ico' }); 
}

문제가있는 부분은 대한 typeof 채널 [I] = '정의되지 않은'및 대해서 typeof 카테고리 [내가] == '정의되지 않은'라인이었다. 나는 그것들을 기능적으로 동등한 것으로 대체했습니다.

출처

2014-07-16 18:59:07

나는 if (** typeof ** channels [i]! == ** '** undefined **'**)'라고 썼다. 'typeof'는 내가 추측하는 문자열을 반환합니다. :) –

이제 모든 것이 예상대로 진행되고 있습니까? 위의 변경 사항과 함께 작동합니다. –

AngularJS 웹 페이지, 연속 로딩

무슨 일이 일어나고 무엇 : 이것은 내가 사용하고 코드입니다

발생해야 일 : AngularJS와 부트 스트랩 선행 입력 플러그인을 구현해야하는 나타납니다

답변

관련 문제