如果未选择任何内容,则设置默认值

时间:2016-02-08 11:10:53

标签: meteor

以下代码应在应用首次启动时将headerLabel设置为“选择项目”。然后,一旦选择了一个项目,headerLabel就会显示项目名称。我能够让它做第二部分而不是第一部分。感谢

//---main_menu.js-----------------------
Template.mainMenu.helpers({
  menuItems: [
    {menuItem: "task1"},
    {menuItem: "task2"},
    {menuItem: "task3"},
    {menuItem: "task4"},
    {menuItem: "task5"},
    {menuItem: "task6"},
    {menuItem: "task7"}
    ]
});

Template.mainMenu.events({
  'click .menuItem': function(event){
    Session.set('selectedItem', $(event.currentTarget).data('value'));
  }
});

//---header.js-----------------------
Template.header.events({
  'click .mainMenu': function(){
    alert("show the main menu ");
  }
});

Template.header.helpers({
  headerLabel: function(){
    var selected = Session.get('selectedItem');
    if (selected === "") {
      headerLabel: "Select an item";
    } else {
      return selected;
    }
  }
});
//---main_menu.html--------------------
<template name="mainMenu">
  <div class="container">
    <div class="row">
      <section class="col-xs-12">
        <div class="list-group">
          {{#each menuItems}}
            <a href="#" class="list-group-item menuItem" data-value={{menuItem}}>
              <img src="/abc.png">
              {{menuItem}} <span class="badge">&#x3e;</span>
            </a>
          {{/each}}
        </div>
      </section>
    </div>s
  </div>
</template>

//---header.html-----------------------
<template name="header">
  <h1>
    <button class="col-xs-2 mainMenu" type="button">&#9776;</button>
  </h1>
  <h3><label class="col-xs-8 text-center">{{headerLabel}}</label></h3>
  <h1>
    <button class="col-xs-2" type="button">&#8942;</button>
  </h1>
</template>

1 个答案:

答案 0 :(得分:1)

实际上非常简单:

#!/bin/bash
#=========================================================
echo "##Updating package manager..."
#=========================================================
sudo apt-get update
echo "##Installing packages..."
#=========================================================
sudo apt-get install -y git php5 memcached php5-cli php5-mysql php5-memcache php5-memcached apache2 php5-curl
#=========================================================
echo "##Installing mysql..."
#=========================================================
# sudo debconf-set-selections <<< 'mysql-server mysql-server/root_password password '
# sudo debconf-set-selections <<< 'mysql-server mysql-server/root_password_again password '
sudo DEBIAN_FRONTEND=noninteractive apt-get -y install mysql-server
# sudo apt-get install -fy
#=========================================================
echo "##Set up apache..."
#=========================================================
sudo a2enmod rewrite
sudo cp /vagrant/box/apache2.conf /etc/apache2/apache2.conf
sudo service apache2 restart
#=========================================================
echo "##Setting up databases..."
#=========================================================
echo 'create database oauth2' | sudo mysql
echo 'create database heatgenius' | sudo mysql
sudo mysql oauth2 < /vagrant/box/create_oauth2.sql
sudo mysql acme < /vagrant/box/create_acme.sql
#=========================================================
echo "##Add api.acme.co.uk to hosts to make it curlable..."
#=========================================================
sudo echo '127.0.0.1 api.acme.co.uk' | sudo tee -a /etc/hosts
#=========================================================
echo "##Link project to server root..."
#=========================================================
sudo rm -r /var/www/html
sudo ln -s /vagrant/public /var/www/html
#=========================================================
echo "##Install PHP packages..."
#=========================================================
curl -sS https://getcomposer.org/installer | php
sudo mv composer.phar /usr/local/bin/composer
cd /vagrant
composer install

在js代码中你可以做到

<h3><label class="col-xs-8 text-center">{{#if headerLabel}}{{headerLabel}}{{else}}Default value{{/if}}</label></h3>