將ASP.NET MVC模型分配給AngularJS作用域

在我的視圖的代碼下面（javascript代碼在視圖中，僅僅用於測試）。將ASP.NET MVC模型分配給AngularJS作用域

我想指定ASP.NET MVC模型（@Model）到AngularJS範圍（$scope.person）

我怎樣才能做到這一點？

謝謝，

視圖

@model MyApp.Person 

<script> 
var myApp = angular.module('myApp', []); 

myApp.controller('personController', ['$scope', '$http', function ($scope, $http) { 
    $scope.person = ????? 
}]); 
</script>

更新1： 我嘗試這樣做的代碼，在JS文件：

var myApp = angular.module('myApp', []); 

myApp.controller('personController', ['$scope', '$http', function ($scope, $http) { 
    $scope.person = @Html.Raw(window.person); 
}]);

在視圖文件：

<script> 
    @{ 
     var serializer = new System.Web.Script.Serialization.JavaScriptSerializer(); 
    } 
    window.person = serializer.Serialize(Model); 
</script>

我得到2個錯誤：

ReferenceError: serializer is not defined (on windows) 
window.person = serializer.Serialize(Model); 

SyntaxError: illegal character (it's the @) 
$scope.person = @Html.Raw(window.person);

來源

2014-09-25 Kris-I

'非法字符'只是一個'假'的IntelliSense假設。當用''包圍時，錯誤將消失。 – devqon 2014-09-25 07:59:46

<script> 
    @{ 
     var serializer = new System.Web.Script.Serialization.JavaScriptSerializer(); 
     var json = serializer.Serialize(Model); 
    } 
    var myApp = angular.module('myApp', []); 

    myApp.controller('personController', ['$scope', '$http', function ($scope, $http) { 
     $scope.person = @Html.Raw(json); 
    }]); 
</script>

來源

2014-09-25 06:53:59

工作，但只有當代碼在視圖中，而不是在一個單獨的JS文件。 – 2014-09-25 07:00:03

@克里斯 - 我喜歡Satpal說，//將數據存儲在全局變量中。 – 2014-09-25 07:01:12

查看js文件中的更新1 – 2014-09-25 07:17:31

我不知道這是否會與角工作。

您可以使用Json.Encode方法將數據對象轉換爲JavaScript Object Notation（JSON）格式的字符串。

window.person = @Html.Raw(Json.Encode(Model)); //Store data in global variable.

在你的角碼的使用，

$scope.person = window.person

然而，最好的解決辦法是創建一個服務，使用服務獲取的人的數據。

完整代碼

@model MyApp.Person 

<script> 
window.person = @Html.Raw(Json.Encode(Model)); //Store data in global variable. 
var myApp = angular.module('myApp', []); 

myApp.controller('personController', ['$scope', '$http', function ($scope, $http) { 
    $scope.person = window.person 
}]); 
</script>

來源

2014-09-25 06:43:32 Satpal

問題是與angularJS。當我添加這一行時，所有的AngularJS代碼都不再工作了。 – 2014-09-25 06:48:04

同樣，AngularJS代碼不再工作。我認爲最好的解決方案不是使用AngularJS。 – 2014-09-25 06:53:04

在視圖中，它的溫度將被移動到單獨的JS文件 – 2014-09-25 06:56:38

我有同樣的問題。這將工作。在你看來：

<script> 
    myApp.value('person', @Html.Raw(Model)); 
</script>

，並在您（角）控制器：

myApp.controller('personController', ['$scope', '$http', 'person' function ($scope, $http, person) { 
    console.log(person); 
}]);

如果「注入」控制器上的JSON值，你的排序。

來源

2017-01-18 17:09:41 suisgrand

在全球的Java腳本變量首先指定值，那麼在您的單獨角文件中使用它

<script> 
 
    var obj = '@Html.Raw(Model)'; 
 
</script>

現在

在角頁

$scope.person = obj;

來源

2017-03-08 17:51:17

將ASP.NET MVC模型分配給AngularJS作用域

回答

相關問題