13

ビューバッグを使用してコントローラーからビューに渡すユーザーのリストがあります。ここで、同じリストをページ上の JavaScript に渡すことができるようにする必要があります。foreach ループを使用してリストを再構築できます。

    @foreach (var item in ViewBag.userList) //Gets list of users passed from controller and adds markers to the map
{
    var userLat = item.LastLatitude;
    var userLon = item.LastLongitude;
    var _userId = item.Id;

    <script>array.push({"userId":"'@_userId'","userLat":"'@userLat'","userLon":"'@userLon'"});</script>
}

ただし、これは面倒なアプローチのように見え、変更が加えられると多くの再作業が必要になります。スタックオーバーフローに関する同様の投稿があることは知っていますが、それらの多くは以前のバージョンの MVC を使用しており、同じ構文は適用されないようです。何か案は?

4

3 に答える 3

24

JSON パーサーを使用すると、安全な 1 行のコードでそれを行うことができます。例で試みたように、文字列の連結などを使用して JSON を手動で構築することは絶対にしないでください。ループも書く必要はありません。

これを行う正しい方法は次のとおりです。

<script type="text/javascript">
    var array = @Html.Raw(
        Json.Encode(
            ((IEnumerable<UserModel>)ViewBag.userList).Select(user => new 
            { 
                userId = user.Id, 
                userLat = user.LastLatitude, 
                userLon = user.LastLongitude 
            })
        )
    );

    alert(array[0].userId);
</script>

生成された HTML は、期待どおりに表示されます。

<script type="text/javascript">
    var array = [{"userId":1,"userLat":10,"userLon":15}, {"userId":2,"userLat":20,"userLon":30}, ...];
    alert(array[0].userId);
</script>

もちろん、このコードの次のレベルの改善は、 を取り除き、ViewCrap厳密に型指定されたビュー モデルを使用することです。

于 2013-03-08T10:17:24.857 に答える
2

別のオプションとして、コントローラーで JsonResult を返す新しいアクションを作成することもできます。この json の結果は、リストを返す可能性があります。あなたのページでは、jquery でアクションを呼び出し、そこから使用できます。

public ActionResult GetMyList()
{
    var list = GetMyUserList();

    return Json(new { userlist = list }, JsonRequestBehaviour.AllowGet);
}
于 2013-03-08T10:21:12.793 に答える
2

@Darin Dimitrovの答えは的を射ています。誰かがビューバッグではなくモデルを渡している場合は、それに追加したいと思います。

<script type="text/javascript">
 var array = @Html.Raw(Json.Encode(
            Model.YourModel.Select(_ => new {
              id = _.Id,
              text = _.Name
            })
          ))

私のユースケースはselect2に固有のものでした。次に、配列を data: 属性に渡すだけです。

 $("#storeSelect").select2({
        data: array,
        placeholder: "Select something"
 });
</script>

ビューモデル

public class YourViewModel
  {
    public IEnumarable<YourPoco> YourPocos { get; set; }
  }

コントローラ

public class YourController : Controller
{
    public ActionResult Index()
    {
        YourViewModel vm = new YourViewModel{
            // Using Dependancy injection
            YourPocos = yourRepo.GetYourPocos();
        };
        return View("Index", "_Layout",vm);
    }
}

この回答は冗長である可能性があることは認識していますが、Json.Encode を使用してモデル値を jquery 拡張機能に渡すのは初めてです。これは私にはクールすぎる。それは、そうでなければ @htmlhelper になるものに、ある程度の拡張性をもたらします。

于 2014-06-19T09:56:55.270 に答える