innerHTML ile AngularJS'yi Kullanma

Bir dizi dizi ve veri içeren bazı AngularJS öğem var. Bir kullanıcı bir dosya yüklediğinde, dosya ayrıştırılır ve farklı dizileriyle kapsam içine kaydedilir. Ancak, tüm bunlar ve dosya kapsamda tutulduktan sonra, innerHTML'i güncelleştirmeye çalışıyorum, ancak AngularJS kodu çalışmıyor. Dizilerden oluşan bir tablo oluşturmak için ng-repeat kullanın, ancak {{column}} ve benzeri gibi görünen içeriğe sahip tek bir hücre olarak kalır.innerHTML ile AngularJS'yi Kullanma

benim index.html diyor çünkü direktifleri ve şablonları kullanarak aşırı zorluk oldu app ve module, o vb ben app.directive(...

gibi bir şey yaptığında, tanımsız olan benim index.html dosyasının önemli parçaları şunlardır:

<html ng-app> 
... //once a file is uploaded, total.js is called; 
//this was so the app didn't try to run before a file was uploaded 
<div id="someStuff">This will become a table once a file is uploaded</div>

Bu benim kapsam total.js içinde nasıl ayarlandığını basit bir örneğidir:

function sheet($rootScope, $parse){ 
    $rootScope.stuff = text; 
//text is a variable that contains the file's contents as a string 
}; 

document.getElementById('someStuff').innerHTML="<div ng-controller='sheet'>{{stuff}}</div>";

HTML değişiyor, ancak dosyanın içeriğini yazdırmak yerine, yalnızca {{stuff}} yazdı. Içeriyi nereye girdiğimi ve sözdizimini tam olarak anlayamadıkça, tercihen bir kısmi veya bir yönerge kullanmadan AngularJS içerdiğini anlamak için innerHTML'yi nasıl alabilirim?

Düzenleme 1: $ derlemeyi kullanmayı denedim ancak tanımlanmamış olarak işaretlendi. Derleme sorununu çözmek için this'a baktım ama rtcherry'nin sözdizimini ve kendi koduma nasıl uygulamalıyım anlamıyorum.

Düzenleme 2: Öyle gibi eklediğinizde hala $ tanımlanmamış derleme hataları alırsınız:

function sheet($rootScope, $parse, $compile){...}; 
document.getElementById('someStuff').innerHTML=$compile("<div ng-controller='sheet'> 
{{stuff}}</div>")(scope);

Edit 3: itcouldevenbeaboat 'in yorumları son derece yararsız iken karar verdim Gösteri belki should Bunu yapmaya çalıştığım yönerge yolu.

benim sac işlevi altında bu kodu dahil: innerHTML <div ng-controller='sheet'>{{stuff}}</div> içerir ve index.html ben Bununla <div spreadsheet></div>

dahil ettik

var app = angular.module('App', []); 
app.directive('spreadsheeet', function($compile){ 
    return{ 
     templateUrl: innerHTML.html 
    } 
});

, ben hiç hata alırsınız, ancak metin yok görünmez, ne {{stuff}} olarak ya da dosyanın içeriği olarak. Basit bir şey yaptığımda bile, templateUrl yerine template: "<h2>Hello!</h2>" sağlamak için Hello! yazdıramıyorum.

kaynak

2013-07-15 user2494584

innerHTML = $ derlemek ("

") (kapsam) –

Eğer enj edebilirsiniz Diğer açısal servisler/araçlar gibi derleyin. $ Scope veya $ rootScope kullanmak istediğiniz gibi. – alfrescian

Hala hatalar alıyorum. Lütfen son düzenlememe bakın. – user2494584

Bana uyar

document.getElementById('someStuff').innerHTML = "<div ng-controller='sheet'>{{stuff}}</div>"; 
$compile(document.getElementById('someStuff'))($scope);

kaynak

2014-10-21 23:33:31 Mher

Basit çözeltisi (100% çalışır):

kontrolörü olarak, bir bağımlılık olarak kontrolörü yılında $ belgesini enjekte etmeyi unutmayın, böyle:

App.controller('indiaController', function ($scope, $document,$filter, $location) { 

    var text_element = angular.element($document[0].querySelector('#delhi'); 
    text_element.html('your dynamic html placed here'); 
}

kaynak

2018-02-05 18:18:12 ngCourse

innerHTML ile AngularJS'yi Kullanma

cevap

İlgili konular