2015-12-03 2 views
1

На мой взгляд, у меня есть тег с ng-bind атрибут, который показывает правильное логическое значение:Как использовать MVC модель связывания с угловыми нг-затруднительное атрибут

<span id="ShowFlag" name="ShowFlag" ng-bind="session.view.showFlag"></span> 

Когда форма размещена на сервере я хотел бы привязать это свойство к соответствующей модели.

public bool ShowFlag { get; set; } 

Однако, это всегда возвращается false, в то время как значение, показанное в Спан тега правильно показывает, как true на этой странице. Есть ли что-то очевидное, что я здесь отсутствует?

+0

В консоли консоли Chrome на вкладке «Сеть» проверьте, что вы действительно отправляете обратно на сервер. Может быть, ответ лежит там. –

+0

Проблема, похоже, связана с привязкой к модели MVC - я вижу, что это свойство устанавливается в свойстве модели на false при отладке действия контроллера POST. –

+0

Итак, вы уверены, что фактическое сообщение содержит «true» в ShowFlag? Правильно ли установлены другие поля? –

ответ

0

Как указано выше, вы должны использовать вход для успешной привязки. Я использовал следующее, которое сейчас работает:

<input type="hidden" id="ShowFlag" name="ShowFlag" ng-value="session.view.showFlag"> 
2

Я думаю, что вам что-то не хватает, как работает привязка AngularJs. если вы хотите получить значение с сервера в угловую модель, вы можете использовать Razor для получения этих данных в JavaScript (лучшее место в вашем угловом контроллере.)

Вот небольшой пример, который я собрал.

Это код контроллера MVC. В этом примере мы используем данные модели и данные ViewBag.

public ActionResult Index() 
{ 
    dynamic model = new ExpandoObject(); 
    model.ShowFlag = "True"; 

    ViewBag.ShowFlag = "ViewBag True"; 
    return View(model); 
} 

Это то, что вид выглядит включая ссылку так Угловое, JQuery и код для приложения AngularJs и контроллер:

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title>Demo</title> 
</head> 
<body> 
    <div> 
     <h2>Sample For Stack Overflow</h2> 

     <div ng-app="glennapp"> 
      <div ng-controller="testController"> 
       <input type="text" ng-model="showFlag" /> 
       <input type="text" ng-model="showFlag2" /> 

       <div> 
        <span ng-bind="showFlag" ></span> 
        <span ng-bind="showFlag2" ></span> 
       </div> 
      </div> 
     </div> 
    </div> 

    <script type="text/javascript" src="//code.jquery.com/jquery-1.11.3.min.js"></script> 
    <script type="text/javascript" src="//code.angularjs.org/1.4.8/angular.min.js"></script> 
    <script type="text/javascript"> 
     var mainApp = angular.module('glennapp', ['glennControllers']); 
     var glennControllers = angular.module('glennControllers', []); 
     glennControllers.controller('testController', ['$scope', function ($scope) { 

      $scope.showFlag = '@ViewBag.ShowFlag'; 
      $scope.showFlag2 = '@Model.ShowFlag'; 
     }]); 
    </script> 
</body> 
</html> 

Другим вариантом было бы создать действие MVC, которая возвращает JsonResult и затем напишите JavaScript, чтобы сделать вызов Ajax и получить данные.

1

При размещении формы только входные и выберите тег значения передаются на сервер в вас дело ShowFlag является диапазон, так что вам нужно сделать это вход:

<input type="checkbox" id="ShowFlag" name="ShowFlag" ng-bind="session.view.showFlag"/> 

Если вы отправляете на сервер с помощью AJAX, убедитесь, что вы сериализовать модель правильно:

, например, для следующих действий:

public ActionResult (FlagsConatiner container) 
{ 
    // 
} 

public class FlagsConatiner 
{ 
    public bool ShowFlag { get; set; } 
} 

Serialized модель должна выглядеть так:

{ 
    "ShowFlag":"true" 
}