2017-08-23 17 views
1

私はプロジェクトで働いています。私たちはAngularjsとsemantic-uiを使っていますが、モーダルポップアップsemantic-uiではAngularの情報を表示させません。AngularjsとSemanticUI issue

例: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'); 
    } 
}]); 

答えて

1

あなたは、コントローラのdiv内のモーダルを配置する必要があります。そのようです。

デモ:here

コード:私の神

<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> 
+0

ああ、あなたは歓迎している@MarioあなたNaren – Mario

+0

私の悪い、感謝:) –