Verileri göstermek için angularjs kullanan javascript kullanarak div ekleme

Eklemek istediğim div, angularjs kullanarak bazı json verilerini göstermelidir.

Sorunum, angularjs, sayfa oluşturulduktan sonra html eklenirken olduğu gibi çalıştığı gibi görünmüyor. Eğik direktifleri kullanarak

<html > 
    <head> 
    <meta charset="utf-8"> 
    <title>Angular test</title> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css"> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script> 
    </head> 

    <script> 


    var featureInfoMainDivId = 'FeatureInfoMaster'; 

    function initAngularDataFeatureInfo() { 
     var s = document.createElement('script'); 
     s.type = "text/javascript"; 
     s.textContent = 
      'var app = angular.module("featureInfoApp", []); ' + 
      'app.controller("featureInfoCtrl", function ($scope) { ' + 
       '$scope.firstName = "John" '+ 
       '$scope.lastName = "Doe" ' + 
      '});'; 
     document.getElementById(featureInfoMainDivId).appendChild(s); 
    } 

    function addFeatureInfoDiv() {   
     var divMain = document.createElement('div');   
     divMain.setAttribute('id', featureInfoMainDivId); 
     divMain.setAttribute('ng-app', "featureInfoApp"); 
     divMain.setAttribute('ng-controller', "featureInfoCtrl"); 
     divMain.innerHTML ='<div> {{ firstName + " " + lastName }}</div>'; 

     document.getElementById('appdiv').appendChild(divMain); 

     initAngularDataFeatureInfo(); 
    } 


    </script> 


    <body > 

    <div id="appdiv"></div> 

    <button id="btn_load_grid" onclick="addFeatureInfoDiv();">loaddata</button> 


    </body> 
</html>

kaynak

2016-04-12 Jacob Christiansen

bir şablon besleyecek bir müşteri yönergesini oluşturabilir. komut yüklendikten sonra size Açısal kodunuzu eklemek olduğundan, manuel Açısal önyükleyebilmek gerekir:

//after initAngularDataFeatureInfo(); 
angular.element(document).ready(function() { 
    angular.bootstrap(document, ['featureInfoApp']); 
});

bu satırı kaldırın:

el Açısal önyükleyebilmek eğer gerekli değildir

divMain.setAttribute('ng-app', "featureInfoApp");

. Daha fazla önyükleme bilgisi için bkz .: Angular bootstrapping documentation.

Ayrıca: Açısal sürüm 1.2.26 kullanmanın bir nedeni var mı? Sürüm 1.5.3 son kararlı yapıdır.

kaynak

2016-04-12 13:33:56 eschmidt

Harika oldu, çok teşekkürler. Şimdi 1.5.3 sürümünü kullanıyorum. –

Dene:

İşte benim testtir. Eğer bunu ng-app ve göbeğini kendisi arar Açısal senaryoyu yüklerseniz o zaman

$scope.firstName = "John"; 
$scope.lastName = "Doe";

içinde iki noktalı virgül eksik beğeninize

kaynak

2016-04-12 12:30:30 Vipul

Verileri göstermek için angularjs kullanan javascript kullanarak div ekleme

cevap

İlgili konular