Angularjs und SemanticUI Problem

Question

Ich arbeite in einem Projekt und wir verwenden Angularjs und semantic-Ui, aber wenn ein modales Popup semantic-ui lassen Sie mich nicht zeigen Informationen aus Angular.

Beispiel: https://jsfiddle.net/rhm3fkn4/5/

<div ng-app='app' ng-controller='controller'> 
    <button class='ui button blue' ng-click="hello()"><i class="write icon"></i>Test</button> 
</div> 

<div class="ui test modal" > 
    <i class="close icon"></i> 
    <div class="header">TEST</div> 
    <div class="content"> 
     {{testing}} 
    </div> 
    <div class="actions"> 
     <div class="ui black button"> 
      Cancel 
     </div> 
     <div class="ui positive right labeled icon button"> 
      Save 
      <i class="checkmark icon"></i> 
     </div> 
    </div> 
</div> 

var app = angular.module('app', []); 
app.controller('controller', ['$scope', '$http', '$filter', function($scope, $http, $filter) { 
    $scope.hello = function() { 
    $scope.testing="It's working"; 
    $('.ui.modal').modal('show'); 
    } 
}]); 

Answer 1

Sie müssen die modal in der Steuerung div platzieren. so.

Demo:here

Code:

<div ng-app='app' ng-controller='controller'> 
    <button class='ui button blue' ng-click="hello()"><i class="write icon"></i>Test</button> 

    <div class="ui test modal" > 
    <i class="close icon"></i> 
    <div class="header">TEST</div> 
    <div class="content"> 
     {{testing}} 
    </div> 
    <div class="actions"> 
     <div class="ui black button"> 
      Cancel 
     </div> 
     <div class="ui positive right labeled icon button"> 
      Save 
      <i class="checkmark icon"></i> 
     </div> 
    </div> 
</div> 


</div>