我正在尝试将具有正确对齐的复选框的ng-repeat数据显示为垂直。下面是我尝试过的代码片段：
<table width="100%" class="table">
<tbody>
<tr>
<td><label for="fruits" class="control-label">Select
Fruits</label></td></td>
<td><label ng-repeat="fruit in MainCtrl.fruits">
<input type="checkbox"> {{fruits}}
</label></td>
</tr>
</tbody>
</table>
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope){
$scope.fruits = {Apple,Mango};
});
它水平显示行，如下所示：Apple Mango，但我希望它垂直显示。
答案 0 :(得分：0)
最简单的方法是使用CSS设置复选框的样式。您可以将它们设置为<build>
<plugins>
<plugin>
<artifactId>maven-assembly-plugin</artifactId>
<version>3.1.0</version>
<configuration>
<descriptors>
<!-- descriptor file previously created. -->
<descriptor>custom-descriptor.xml</descriptor>
</descriptors>
</configuration>
<executions>
<execution>
<id>make-assembly</id>
<phase>package</phase>
<goals>
<goal>single</goal>
</goals>
</execution>
</executions>
</plugin>
</plugins>
.....
</build>
和或RecyclerView recyclerView;
FirebaseDatabase firebaseDatabase;
DatabaseReference myRef;
private FirebaseRecyclerAdapter<ShowDataItems, ShowDataViewHolder> mFirebaseAdapter;
public ShowData(){
}
@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.show_data_layout);
firebaseDatabase = FirebaseDatabase.getInstance();
myRef = FirebaseDatabase.getInstance().getReference("User_Details");
recyclerView = (RecyclerView)findViewById(R.id.show_data_recycler_view);
recyclerView.setLayoutManager(new LinearLayoutManager(ShowData.this));
Toast.makeText(ShowData.this, "Wait ! Fetching List...", Toast.LENGTH_SHORT).show();
}
protected void onStart(){
super.onStart();
//Log.d("LOGGED", "IN onStart ");
mFirebaseAdapter = new FirebaseRecyclerAdapter<ShowDataItems, ShowDataViewHolder>
(ShowDataItems.class, R.layout.show_data_single_item, ShowDataViewHolder.class, myRef)
{
public void populateViewHolder(final ShowDataViewHolder viewHolder, ShowDataItems model, final int position) {
viewHolder.Image_URL(model.getImage_URL());
viewHolder.Image_Title(model.getImage_Title());
//OnClick Item
viewHolder.itemView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(final View v) {
AlertDialog.Builder builder = new AlertDialog.Builder(ShowData.this);
builder.setMessage("Do you want to Delete this data ?").setCancelable(false)
.setPositiveButton("Yes", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
int selectedItems = position;
mFirebaseAdapter.getRef(selectedItems).removeValue();
mFirebaseAdapter.notifyItemRemoved(selectedItems);
recyclerView.invalidate();
onStart();
}
})
.setNegativeButton("No", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
dialog.cancel();
}
});
AlertDialog dialog = builder.create();
dialog.setTitle("Confirm");
dialog.show();
}
});
}
};
recyclerView.setAdapter(mFirebaseAdapter);
}
//View Holder For Recycler View
public static class ShowDataViewHolder extends RecyclerView.ViewHolder {
private final TextView image_title;
private final ImageView image_url;
public ShowDataViewHolder(final View itemView) {
super(itemView);
image_url = (ImageView) itemView.findViewById(R.id.fetch_image);
image_title = (TextView) itemView.findViewById(R.id.fetch_image_title);
}
private void Image_Title(String title) {
image_title.setText(title);
}
private void Image_URL(String title) {
// image_url.setImageResource(R.drawable.loading);
Glide.with(itemView.getContext())
.load(title)
.apply(new RequestOptions()
.placeholder(R.drawable.loading)
.error(new ColorDrawable(Color.RED))
.centerCrop()
.dontAnimate()
.dontTransform())
.into(image_url);
}
}