使用angularjs在umbraco中渲染局部視圖

Question

我想渲染一個對話框，在控制器內部使用一種表達形式。

我創建了一個簡單的局部視圖：

@using formulate.app.Types 
@{ 
      // Get a view model for the picked form. 
    var pickedForm = Model.Content.GetPropertyValue<ConfiguredFormInfo>("formPicker"); 
    var vm = formulate.api.Rendering.GetFormViewModel(pickedForm.FormId, pickedForm.LayoutId, 
     pickedForm.TemplateId, 
     // Include this parameter in Formulate 0.3.7 or greater. 
     Model.Content); 

} 

<md-dialog> 
    <form ng-cloak> 
     <md-toolbar></md-toolbar> 
     <md-dialog-content><p>@Html.Partial("~/Views/Partials/Formulate/RenderForm.cshtml", vm)</p></md-dialog-content> 
     </form> 
</md-dialog> 

然後在我的頁面我添加了一個簡單的函數，顯示了該模板的對話框：

<script> 
    var app = angular.module('app', ['ngMaterial']) 
    .controller('JobCtrl', function($scope, $mdDialog){ 


     $scope.showDialog = function(ev){ 
      $mdDialog.show({ 
       templateUrl: <path-to-partial-view>, 
       parent: angular.element(document.body), 
       targetEvent: ev, 
       clickOutsideToClose:true 
      }); 
     }; 
    }); 
</script> 

最後，在我的網頁的HTML，我用ng-click調用這個函數：

<md-button class="md-primary md-raised" ng-click="showDialog($event)">שלח קו"ח למשרה זאת</md-button> 

當我點擊這個按鈕時，屏幕變暗有一個陰影（這是角度 - 材質如何顯示對話框），沒有錯誤，但沒有任何渲染，我根本沒有看到對話框。

Answer 1

請嘗試這個，它是工作的例子。

將此代碼添加到html文件。

<script type="application/ng-template" id="dialog-template"> 
    @using formulate.app.Types 
    @{ 
     var pickedForm = Model.Content.GetPropertyValue<ConfiguredFormInfo>("formPicker"); 
     var vm = formulate.api.Rendering.GetFormViewModel(pickedForm.FormId, pickedForm.LayoutId, pickedForm.TemplateId, Model.Content); 

    } 

    <md-dialog> 
     <form ng-cloak> 
      <md-toolbar></md-toolbar> 
      <md-dialog-content> 
       <p>@Html.Partial("~/Views/Partials/Formulate/RenderForm.cshtml", vm)</p></md-dialog-content> 
     </form> 
    </md-dialog> 
    </script> 

腳本

$mdDialog.show({ 
    template: $('#dialog-template').html(), 
    clickOutsideToClose: true, 
});