如何关闭菜单 - cuppa-ng2-slidemenu

时间:2018-02-10 03:00:22

标签: html5 angular

我正在使用此angular ng2 slide menu library。你能否建议我在选择任何项目后关闭菜单。

配置说有一个选项。不确定如何配置值。

谢谢, Raja K

1 个答案:

答案 0 :(得分:1)

根据angular ng2 slide library documentation
 在模板中添加 config 属性,例如

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {

  config = {
    closeOnCLick: true
  };
}

在ts文件中,您可以定义// parent-component.vue <template> <child :value1="value1" :value2="value2" ref="my-child"> </child> </template> <script> export default () { name: 'parent component', methods: { getChildProps() { console.log(this.$refs['my-child'].mutableValue1); // outputs mutableValue }, }, }; <script> ,如文档中所示。

// parent-component.vue
<template>
    <child :value1="value1" 
           :value2="value2"
           @change=doSomething>
    </child>
</template>

<script>
export default () {
     name: 'parent component',
     methods: {
         doSomething(payload) {
             console.log(payload); // outputs mutableValue
         },
     },
};
<script>

// child-component.vue

<template>
    <v-ons-search-input v-model="mutableValue1"></v-ons-search-input>
</template>

<script>
export default {
    props: ['value1', 'value2'],
    name: 'child',
    data() {
        return {
            mutableValue1: this.value1,
        };
    };
    watch: {
        mutableValue1(val) {
            this.$emit('change', mutableValue1);
        },
    },
};
</script>

这是 live working demo