Konnte keine Attribute aus dem Controller in angular js ionic

Question

hinzufügen Ich verwende angularjs. Ich versuche, zu suchen und zu dem Benutzer auf Click zu navigieren. Bei der Suche erstelle ich HTML vom angularjs Controller und zeige in der Ansicht an.

Aber das Merkwürdige ist, in HTML kann ich Attributsklasse, aber nicht ID oder ng-klicken. Ich möchte einfach nur ng-click in den HTML-Code einfügen, damit ich auch auf den Klick klicken kann. Beim Klicken möchte ich zu dem bestimmten Benutzerprofil navigieren.

Hier ist mein Code, bitte überprüfen Sie es und schlagen Sie mir vor, wo ich falsch liege.

.controller('searchDesignCtrl', function($scope,$http,api_root) { 
    $scope.html = '<div class="button-bar"><a class="search-item"><i class="ion-person"></i>Username</a><a class="search-item"><i class="ion-person"></i>Username</a><a class="search-item"><i class="ion-person"></i>Username</a><a class="search-item"><i class="ion-person"></i>Username</a><a class="search-item"><i class="ion-person"></i>Username</a><a class="search-item"><i class="ion-person"></i>Username</a></div>' 
    $scope.searchuser = function(element){ 
     $scope.value_input = $(element.currentTarget).val(); 
     var link = api_root+'users/search_users'; 
     $http({ 
      url: link, 
      method: "POST", 
      data: 'uname=' + $scope.value_input, 
      headers: {'Content-Type': 'application/x-www-form-urlencoded'} 
      }).success(function (data, status, headers, config) { 
       $scope.fetched_users = data.data; 
       $scope.html ='<div class="button-bar">'; 
       $.each($scope.fetched_users, function(key,value){ 
        //here ng-click is not added in the view 
        $scope.html+= '<a class="search-item '+value.User.id+'" ng-click="navigate_to_user()"><i class="ion-person"></i>'+value.User.username+'</a>'; 
       }); 
       $scope.html +='</div>'; 
//    console.log($scope.html); 
      }).error(function (data, status, headers, config) {}); 
    } 
    $scope.navigate_to_user=function(){ 
     console.log($scope); 
    } 
}) 

Answer 1

Danke Alex für die Antwort. Mit dem $ comiple-Service, der von eckigen bereitgestellt wird, kann ich das beheben. Hier ist die Dokumention: $compile

In meinem Fall die html zu sehen, schrieb ich Kompilierung Direktive:

.directive('compile', function($compile) { 
     // directive factory creates a link function 
     return function(scope, element, attrs) { 
     scope.$watch(
      function(scope) { 
      // watch the 'compile' expression for changes 
      return scope.$eval(attrs.compile); 
      }, 
      function(value) { 
      // when the 'compile' expression changes 
      // assign it into the current DOM 
      element.html(value); 

      // compile the new DOM and link it to the current 
      // scope. 
      // NOTE: we only compile .childNodes so that 
      // we don't get into infinite loop compiling ourselves 
      $compile(element.contents())(scope); 
      } 
     ); 

und im Hinblick Ich schrieb:

<div compile="html"></div>  //uses the $compile directive