Question

import com.google.gson.annotations.Expose; import com.google.gson.annotations.SerializedName; public class Attachments { @SerializedName("id") @Expose private String id; @SerializedName("title") @Expose private String title; @SerializedName("url") @Expose private String url; @SerializedName("thumbnailUrl") @Expose private String thumbnailUrl; public String getId() { return id; } public void setId(String id) { this.id = id; } public String getTitle() { return title; } public void setTitle(String title) { this.title = title; } public String getUrl() { return url; } public void setUrl(String url) { this.url = url; } public String getThumbnailUrl() { return thumbnailUrl; } public void setThumbnailUrl(String thumbnailUrl) { this.thumbnailUrl = thumbnailUrl; } @Override public String toString() { return "Attachments{" + "id='" + id + '\'' + ", title='" + title + '\'' + ", url='" + url + '\'' + ", thumbnailUrl='" + thumbnailUrl + '\'' + '}'; } }的URL需要花一些时间才能在屏幕上加载。在public class MainActivity extends AppCompatActivity { private static final String TAG = "MainActivity"; private static final String BASE_URL = "https://private-96848-7egend.apiary-mock.com/"; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); Button btGetData = findViewById(R.id.btGetData); Retrofit retrofit = new Retrofit.Builder() .baseUrl(BASE_URL) .addConverterFactory(GsonConverterFactory.create()) .build(); LegendAPI legendAPI = retrofit.create(LegendAPI.class); Call<Feed> call = legendAPI.getStuff(); call.enqueue(new Callback<Feed>() { @Override public void onResponse(Call<Feed> call, Response<Feed> response) { Log.d(TAG, "onResponse: Server Response: " + response.toString()); Log.d(TAG, "onResponse: Received information " + response.body().toString()); ArrayList<Attachments> attachmentsList=response.body().getMessage().getAttachments(); for (int i=0;i< attachmentsList.size();i++){ Log.d(TAG, "onResponse: \n" + "id:"+ attachmentsList.get(i).getId()+ "\n" + "title"+ attachmentsList.get(i).getTitle()+ "\n" + "url"+ attachmentsList.get(i).getUrl()+ "\n" + "thumbnailUrl"+ attachmentsList.get(i).getThumbnailUrl()+ "\n" + "--------------------------------------\n\n"); } } @Override public void onFailure(Call<Feed> call, Throwable t) { Log.e(TAG, "on Failure: Something went Wrong" + t.getMessage()); Toast.makeText(MainActivity.this, "Something went Wrong", Toast.LENGTH_SHORT).show(); } }); } }图像完全加载之前，是否可以添加占位符图像或默认图像？

import com.google.gson.annotations.Expose;
import com.google.gson.annotations.SerializedName;

public class Feed {

    @SerializedName("messages")
    @Expose
    private Message messages;

    @SerializedName("users")
    @Expose
    private Users user;

    public Message getMessage() {
        return messages;
    }

    public void setMessage(Message messages) {
        this.messages = messages;
    }

    public Users getUser() {
        return user;
    }

    public void setUser(Users user) {
        this.user = user;
    }

    @Override
    public String toString() {
        return "Feed{" +
                "messages=" + messages +
                ", user=" + user +
                '}';
    }
}

Answer 1

您可以使用[ngStyle]="{'background-image':'url(' +imageUrl+ ')'}"

Answer 2

一种方法，您可以创建指令以为html中的元素设置占位符图像。

根据您的情况，您还可以执行以下操作：

<div>
    <img src="img/placeholderDefault.jpg" ng-src="{{item.imgSrc}} "  height="150px " width="300px ">
</div>

在加载真实图像时，它将替换placeholderDefault图像。然后您可以根据需要在所需范围内设置ng-src图像。

如果ng-src无法在angular 2+中运行，请尝试

<img src="{{item.imgSrc}}">

或

<img [src]="item.imgSrc">

在这种情况下，

在控制器中的作用域中声明一个对象为 $scope.item={}并设置$scope.item.imgSrc="defaultImagePath"，当您新建原始图像加载，然后替换为原始图像路径。

希望这个想法可以为您提供帮助

Angular 4中div背景图像的占位符

2 个答案: