Einfache Bindung funktioniert nicht

-1

Im folgenden Code-Schnipsel kann ich keinen einfachen Wert von search_username drucken.Einfache Bindung funktioniert nicht

HTML-Code:

<!DOCTYPE html> 
<html> 

<head> 
    <script data-require="[email protected]" data-semver="1.5.5" src="https://code.angularjs.org/1.5.5/angular.min.js"></script> 
    <link rel="stylesheet" href="style.css" /> 
    <script src="script.js"></script> 
</head> 

<body ng-app="GibtHubViewer"> 

    {{search_username}} <!-- not getting displayed --> 

    <form name="searchUser"> 
    <br/> 
    <input type="search" placeholder="Username to search" ng-model="search_username" /> 
    <input type="submit" value="search" /> 
    </form> 

    <br/> 

    <div ng-controller="MainController"> 
    {{userdata.name}} {{error}} 
    </div> 

</body> 

</html>

JS-Code:

// Code goes here 


var MainController = function($scope, $http) { 

    $scope.search_username = "anyname"; // Value assigned here 


    var onComplete = function(response) { 
    $scope.userdata = response.data; 
    } 

    var onError = function(reason) { 
    $scope.error = "Not able to fetch data"; 
    } 

    var request = $http.get("https://api.github.com/users/angular"); 

    request.then(onComplete, onError); 



} 

var myModule = angular.module("GibtHubViewer", []); 

myModule.controller("MainController", ["$scope", "$http", MainController]);

Danke

Quelle

2016-06-01 reiley

Ihr Modell aus Anwendungsbereich. Sie sollten alle Modelle in den Geltungsbereich aufnehmen, die sie nach Controller definieren.

<body ng-app="GibtHubViewer" ng-controller="MainController"> 

    {{search_username}} <!-- not getting displayed --> 

<form name="searchUser"> 
     <br/> 
    <input type="search" placeholder="Username to search" ng-model="search_username" /> 
    <input type="submit" value="search" /> 
    </form> 

    <br/> 

    <div > 
    {{userdata.name}} {{error}} 
    </div> 

    </body>

Quelle

2016-06-01 14:28:48

Die Position, wo Sie das Modell aus Umfang der Controller versuchen, zu drucken, das verwendet wird, versuchen Sie dies:

<!DOCTYPE html> 
    <html> 

    <head> 
     <script data-require="[email protected]" data-semver="1.5.5" src="https://code.angularjs.org/1.5.5/angular.min.js"></script> 
     <link rel="stylesheet" href="style.css" /> 
     <script src="script.js"></script> 
    </head> 

    <body ng-app="GibtHubViewer" ng-controller="MainController"> 

     {{search_username}} <!-- not getting displayed --> 

     <form name="searchUser"> 
     <br/> 
     <input type="search" placeholder="Username to search" ng-model="search_username" /> 
     <input type="submit" value="search" /> 
     </form> 

     <br/> 

     <div> 
     {{userdata.name}} {{error}} 
     </div> 

    </body> 


    </html>

Quelle

2016-06-01 14:33:52

Sie versuchen, die {{search_username}} außerhalb der Steuerung Bereich anzuzeigen.

Die search_username wird im Bereich in MainController hinzugefügt, aber Sie versuchen, das außerhalb der MainController Bereich zu drucken.

<div ng-controller="MainController"> {{userdata.name}} {{error}} search_username - {{search_username}} // This will print the username </div>

Quelle

2016-06-01 14:37:34

Einfache Bindung funktioniert nicht

Antwort

Verwandte Themen