小编use*_*169的帖子

我是AngularJS的新手,所以请耐心等待.我正在使用Angular Material Design,我很难找到有效做响应网格的方法.

请在下面的代码中查看我的评论:

    <div layout="row">
<div layout="row" flex="75" layout-sm="column" class="ptn-info-grid" layout-margin> <!-- USING ROW FOR DESKTOP AND COLUMN FOR MOBILE DEVICES -->

    <div layout="column" flex="66"> <!-- I want this div occupy 2/3 of screen in Desktop but change to 100 in mobile devices (but stays in 66) -->


        <div layout="row" layout-sm="column">
            <div class="ptn-info-grid-item" flex>1</div>
            <div class="ptn-info-grid-item" flex>2</div>
        </div>

        <div layout="row" layout-sm="column">
            <div class="ptn-info-grid-item" flex>3</div>
            <div class="ptn-info-grid-item" flex>4</div>
        </div>

    </div>

    <div layout="column" flex="32"> <!-- I want this div …

我在转发器中有一个UserControl.转发器的数据源来自SQL Server.

用户控件的.cs - MoviePanel.ascx.cs:

public int myMovieID { get; set; }
public string myMovieName { get; set; }
public string myMovieDescription { get; set; }

protected void Page_Load(object sender, EventArgs e)
{
   MovieIDLbl.Text = myMovieID.ToString();
   MovieNameLbl.Text = myMovieName;
   DescriptionLbl.Text = myMovieDescription;
}

ASPX页面:

<asp:Repeater ID="Repeater1" DataSourceID="ListOfMoviesDS" runat="server">
    <ItemTemplate>
        <uc1:MovieDetailPanel runat="server" myMovieID='<%# Eval("MovieID") %>' 
           myMovieName='<%# Eval("movieName") %>' 
                myMovieDescription='<%# Eval("movieDescription") %>' 
                id="MovieDetailPanel1" />

        <asp:Label ID="Label1" runat="server" 
              Text='<%# Eval("MovieID") %>'></asp:Label>
        <asp:Label ID="Label2" runat="server" 
              Text='<%# Eval("movieName") %>'></asp:Label>
        <asp:Label ID="Label3" runat="server" 
             Text='<%# Eval("movieDescription") %>'></asp:Label> …

我按照 Mongo 文档中的建议在子集合中参考父集合，因为子集合有增长的前景。 https://docs.mongodb.com/manual/tutorial/model-referenced-one-to-many-relationships-between-documents/

发布者（父）集合：

{
   _id: "oreilly",
   name: "O'Reilly Media",
   founded: 1980,
   location: "CA"
}

图书（儿童）收藏 - 参考其中的出版商：

{
   _id: 123456789,
   title: "MongoDB: The Definitive Guide",
   author: [ "Kristina Chodorow", "Mike Dirolf" ],
   published_date: ISODate("2010-09-24"),
   pages: 216,
   language: "English",
   publisher_id: "oreilly"
},{
   _id: 234567890,
   title: "50 Tips and Tricks for MongoDB Developer",
   author: "Kristina Chodorow",
   published_date: ISODate("2011-05-06"),
   pages: 68,
   language: "English",
   publisher_id: "oreilly"
}

现在我想要实现的是让所有出版商拥有他们的书籍子数组：

    {
  "_id": "oreilly",
  "name": "O'Reilly Media",
  "founded": 1980,
  "location": "CA",
  "books": [
    {
      "_id": …