如何使用 C# 和 Angular js 在视图上显示数据

How to show data on the view using C# and Angular js

本文关键字：视图 显示 数据 js 何使用 Angular      更新时间：2023-09-26

我有以下控制器： 

  public class UserController : BaseApiController
    {
        // GET api/<controller>
        public string Get()
        {
            var currentuser = CurrentUser.Name;
            return currentuser;
        }
    }

当前用户的值 我以这种方式将数据上下文传递给它： 

 function getName() {
                var deferred = $q.defer();
                var promise = deferred.promise;
                cachedPromises.currentuser = promise;
                $http.get(baseUrl + 'api/user').success(getSucceeded).error(getFailed);
                return cachedPromises.currentuser;
                function getSucceeded(data) {
                    console.log('data:', data);
                }
                function getFailed(parameters) {
                        console.log("failed", parameters);
                    }
            }

在控制台日志console.log('data:', data);我获取值，为了应用绑定，我必须将此值传递给控制器.js中的范围。为了做到这一点，我以这种方式做了一个控制器。

LogName.$inject = ['$scope', 'datacontext']
    function LogName($scope, datacontext) {
        $scope.name =[];
        datacontext.getName().then(function (currentuser) {
            $scope.name = currentuser;
        });
    }

在视图上，我有以下用于数据绑定的代码： 

 <h1 ng-controller="LogName" class="title">{{name}}</h1>

绑定显示为空数组，我不明白出了什么问题.

编辑：当我在控制器上执行控制台登录时：

  datacontext.getName().then(function (currentuser) {
            $scope.name = currentuser;
            console.log('current', currentuser);
        });

视图上不显示任何内容，编译器未到达 datacontext.getName

您的 MVC 控制器返回字符串public string Get()并将$scope.name =[];声明为数组将其更改为应该有帮助$scope.name ='';

并将函数 getName 更改为 ：

function getName() {
    var deferred = $q.defer();

    $http.get(baseUrl + 'api/user').success(getSucceeded).error(getFailed);
     return deffered.promise;
    function getSucceeded(data) {
        console.log('data:', data);
        //add this
        deferred.resolve(data);
    }
    function getFailed(parameters) {
        console.log("failed", parameters);
        deferred.reject(parameters);;
    }
     return deffered.promise;
}

你永远不会解决你提供名称的承诺。 向 getSuccess 函数添加解析，向错误函数添加拒绝。 

function getSucceeded(data) {
   console.log('data:', data);
   promise.resolve(data);
}
function getFailed(parameters) {
   console.log("failed", parameters);
   promise.reject(parameters);
}

这将向等待承诺结果的函数提供数据。

有两个问题：

首先，你没有解决承诺。您需要使用从服务器返回的数据来解决您的承诺。

其次，结果实际上位于从服务器返回的数据的 results 属性中。在这里，由于您只检索名称，因此应使用以下代码：

function getSucceeded(data) {
   console.log('data:', data);
   deferred.resolve(data.results[0]);
}
相关文章：