Question

您好我是javascript和AngularJS的新手。这是我从服务器获取.json的函数（服务器返回JSON）：

<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
>

<android.support.design.widget.AppBarLayout
    android:id="@+id/main.appbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay"
    android:fitsSystemWindows="true"
    >

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/main.collapsing"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        app:layout_scrollFlags="scroll|exitUntilCollapsed"
        app:contentScrim="?colorPrimary"
        >

        <ImageView
            android:id="@+id/main.imageview.placeholder"
            android:layout_width="match_parent"
            android:layout_height="200dp"
            android:scaleType="centerCrop"
            android:src="@drawable/material_flat"
            app:layout_collapseMode="parallax"
            android:fitsSystemWindows="true"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            />

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:title=""
            app:layout_scrollFlags="scroll|enterAlways|snap"
            app:layout_collapseMode="pin"
            />
    </android.support.design.widget.CollapsingToolbarLayout>


    <FrameLayout
        android:id="@+id/main.framelayout.title"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center_horizontal"
        android:background="?colorPrimary"
        android:orientation="vertical"
        app:layout_scrollFlags="scroll|enterAlways"
        >

        <LinearLayout
            android:id="@+id/main.linearlayout.title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:orientation="vertical"
            >

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:gravity="bottom|center"
                android:text="Information"
                android:textColor="@android:color/white"
                android:textSize="30sp"
                />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:layout_marginTop="4dp"
                android:text="Tagline"
                android:textColor="@android:color/white"
                />

        </LinearLayout>
    </FrameLayout>
</android.support.design.widget.AppBarLayout>

<android.support.v4.widget.NestedScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="yu.heetae.android.materialdesign.ScrollingActivity"
    tools:showIn="@layout/activity_scrolling">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/text_margin"
        android:text="@string/large_text"/>

</android.support.v4.widget.NestedScrollView>

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_margin="@dimen/fab_margin"
    app:layout_anchor="@id/main.framelayout.title"
    app:layout_anchorGravity="top|end"
    app:srcCompat="@android:drawable/ic_dialog_email"/>

我的问题是：这是从网络服务器获取数据的最佳方式 我不仅想知道响应是否成功，还要知道状态代码是否为200。

然后我想知道我是否真的想要返回错误（我想要显示带有文本的图像：＆＃34;无法与服务器连接。再次尝试和＃34;）。但我使用Ionic制作应用程序（HTML5，CSS3和使用AngularJS的javascript）。那么...什么是返回错误的最佳方式，我希望用文本显示我在apache cordova中编程的图像。谢谢！

Answer 1

根据AngularJS文档：

$ http服务是一个便利的核心Angular服务与远程HTTP服务器的通信

来自$ http调用的响应对象具有以下属性：

数据 - {string | Object} - 使用转换函数转换的响应体。

状态 - {number} - 响应的HTTP状态代码。您可以使用它来根据不同的代码制定逻辑

statusText - {string} - 响应的HTTP状态文本。

在您的示例中，您已实现了Promise.protorype.then（）函数，该函数允许您委托成功（第一个参数）和错误（第二个参数），以便在实现承诺后进一步处理（$ http.get电话已经完成。）

这就是我根据你的例子做的事情：

function getProducts() {
    // Call the http get function
    return $http.get(url).then(

        //The request succeeded - 200 status code
        function(response) {
            products= response.data.result;
                return products;
        },

        //The request failed
        function(response) {

           // Here you can access the status property and the statusText
           console.log("Http Status: " + response.status + " Description: " +   response.statusText);

           // Return a false result
           return false;
});

我通常会使用像Angular-UI-Notification之类的库来清理它，我会像这样实现它：

//The success handler function
function handle_response_success(response) {
    // Do processing here based on the response then show a success notification
    Notification.success('Success notification');
};

// The error handler function
function handle_response_error(error) {
     Notification.error('Something went wrong with that request. More Info: ' + 'Http Status: ' + error.status + ' Description: ' +   error.statusText);
}

// Then finally bind it to your getProducts call

function getProducts() {

    // More elegant proto imho
    return $http({ method: 'GET',
        url: 'http://example.com'
     });
};

// More elegant way to handle this imho
getProducts.then(handle_response_success.bind(this), handle_response_error.bind(this);

如何从URL获取状态代码

1 个答案: