從Angular中刪除img-element頁面

我創建了一個角度的web應用程序，我首先要顯示圖像，但是當您單擊按鈕時，我想要刪除此默認圖像並將其替換爲videostream的網絡攝像頭。但到目前爲止，刪除圖像 - 元素仍然很難...從Angular中刪除img-element頁面

angular.module('qrWebapp').directive('qrScanner', ['$timeout', 'openScannerService', function($timeout, openScannerService) { 
    return { 
    restrict: 'E', 
    scope: { 
     ngSuccess: '&ngSuccess', 
     ngError: '&ngError', 
     ngVideoError: '&ngVideoError' 
    }, 
    link: function(scope, element, attrs) { 
     var isOpen; 
     var onlyOpenOnce = 0; 

     var image = document.createElement('img'); 
     image.setAttribute('id', 'defaultImage'); 
     image.setAttribute('src', 'assets/images/defaultimage.png'); 
     image.setAttribute('width', '400'); 
     image.setAttribute('height', '300'); 
     image.setAttribute('alt', 'defaultimage'); 

     scope.$on('handlePublish', function() { 
     isOpen = openScannerService.sharedBoolean; 

     if(isOpen){ 
     //some code 
      //finding the image on the angular page  
      var findedElement = angular.element('#defaultImage'); 
      findedElement.remove(); 

      var context; 

      if(onlyOpenOnce < 1){ 
      angular.element(element).append(video); 
      angular.element(element).append(canvas); 
      context = canvas.getContext('2d'); 
      } 

      onlyOpenOnce++; 
    } 
    else { 

     angular.element(element).append(image); 
    } 
    }); 
} 
    }; 

}]);

有沒有人有任何想法我做錯了什麼？

來源

2015-04-29 Jesper

您不應該嘗試刪除該明智的DOM。而是使用ng-if，它有條件地呈現頁面上的元素。

對於例如，在你的HTML

<img id="imgID" src="assets/images/defaultimage.png" ng-if="renderImage" /> 
    <canvas ng-if="renderCanvas"></canvas>

，然後在你的指令：

來源

2015-04-29 03:21:14

它的工作，但我只用了NG-如果圖像，而不是在畫布上。我也用一個服務來調整這個值。感謝這個答案！ – Jesper

很高興幫助。如果最適合您的用例，請選擇它作爲答案。 –

從Angular中刪除img-element頁面

回答

相關問題