Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(MdChips): formatter #1339

Merged
merged 8 commits into from
Jan 12, 2018
Merged

feat(MdChips): formatter #1339

merged 8 commits into from
Jan 12, 2018

Conversation

VdustR
Copy link
Member

@VdustR VdustR commented Dec 25, 2017

New props :md-format for the formatter before chip insertion. Effects to insertion and duplicated-checking.

fix #1288

Formatter before chip insertion. Effects to insertion and duplicated-checking.

fix #1288
type: 'Function',
description: [
'Formatter before chip insertion. Effects to insertion and duplicated-checking.',
'@param {<code>String</code>} input value'
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe we can explicitly say that this function will receive this parameter. There is an example on md-table component

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fix ca3ac20

</md-chips>
<md-chips class="md-primary" v-model="artists" md-placeholder="Add artist..." :md-format="formatName">
<label>Artists</label>
<div class="md-helper-text">Try insert `Eugène Ysaÿe` twice. The formatter will remove diacritics.</div>
Copy link
Member

@marcosmoura marcosmoura Dec 26, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this message correct? Try insert 'Eugène Ysaÿe' twice. I think a good one could be:
Try inserting a chip with 'Eugène Ysaÿe'

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, I expect developers see this:

image

// capitalize
words = words.map(str => str[0].toUpperCase() + str.slice(1))
let result = words.join(' ')
return result
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just return the words.join(' ') instead of creating a new var

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fix e955e99

}
},
methods: {
insertChip ({ target }) {
if (!this.inputValue || !this.modelRespectLimit) {
let inputValue = this.formattedInputValue
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Add a space before if statement

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fix 79f4f41

@marcosmoura
Copy link
Member

Great idea! We can use this on autocomplete as well.
I just comment about some minor issues!

Thank you!

<div class="page-container-section">
<h2>Formatter</h2>

<p>There could be a rule to be followed by the inserted chips:</p>
Copy link
Member

@marcosmoura marcosmoura Dec 26, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A better message could be:
Sometimes you may need to format a chip value before adding it, and for this case you can use a custom formatter function. This function will receive the chip value and must return the formatted value.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fix 8a52166

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[MdChips] custom duplicated checking method
2 participants