最近开始接触angular sj ui router 由于不太懂 也是踩了不少坑
在这里记录 已被后期 review
首先是mac 配置 rails 时报错
/Users/xiaoyu/.rvm/gems/ruby-2.2.0@baozheng/gems/json-1.8.2/lib/json/ext/parser.bundle: [BUG] Segmentation fault at 0x00000000000440
ruby 2.2.0p0 (2014-12-25 revision 49005) [x86_64-darwin14]
-- Crash Report log information --------------------------------------------
See Crash Report log file under the one of following:
* ~/Library/Logs/CrashReporter
* /Library/Logs/CrashReporter
* ~/Library/Logs/DiagnosticReports
<!--StartFragment--> <!--EndFragment-->
* /Library/Logs/DiagnosticReports
这主要是因为 在设置电脑的时候自己没有给自己root权限导致
如果知道的情况下会很抓狂
运行 sudo rails s
这时候会报错 请求安装miss gems
运行sudo bundle install
<!--StartFragment--> <!--EndFragment-->
再次运行 sudo rails s
好 环境都安装完毕以后
我们 clone 代码 安装必须的 gem 进行数据库 文件导入
数据库迁移
启动服务器就看到熟悉的 界面了
下面是正题
这次我们要添加一个版本更新功能 在页面上输入版本号和连接 点击按钮 将版本信息提交到数据库中
要求 每次提交都会覆盖之前的提交
首先建立一个简单的页面 version_uodate.html.slim
.modal-header.pts.pbs
.modal-title
strong.mrh
| 版本更新 - (用于 iOS 端自动升级)
.modal-body
input.form-control[
ng-model="versions"
placeholder="请输入版本"
required
]
p
input.form-control[
ng-model="link"
placeholder="请输入连接"
required
]
.modal-footer
a.btn.btn-primary.btn-wide.pull-left ng-click='updateVersion()' ng-disabled='!versions || !link'
| 确定
ng-disabled='!versions || !link'这一句是实现了上面text没有输入的话确定按钮将不可以点击！
上面的格式需要注意 必须对其 看得出来我们的页面代码量很少 许多功能都是约定的
在 settings.js.coffee.erb 中写入这些内容
app = window.app
app.config ($stateProvider, $urlRouterProvider) ->
$stateProvider.state("versionUpdate",
url: '/version_update'
controller: "SettingsCtrl"
templateUrl: "<%= asset_path("settings/version_update.html.slim") %>"
)
return
这里是 angular js ui router
给versionUpdate 写一个路径
更新的动作在api/v1这里settings.rb 输入如下内容
class API::V1::Settings < Grape::API
include API::V1::Helpers
doorkeeper_for :all
before do
# authenticate!
end
helpers do
# def permitted_params
# ActionController::Parameters.new(params[:settlement]).permit(
# :amount, :customer_id, :user_id, :order_id, order_ids: [], pay_records: []
# ).tap do |hash|
# hash[:pay_records] = params[:settlement][:pay_records]
# end
# end
end
resource :settings do
desc "Update a version."
put '/update' do
# 删除全部
# 创建记录
Setting.create!(
version_number:params[:setting][:version_name],
link:params[:setting][:link]
)
end
end
end
在这我们添加了一个api
文件位于controller下的settings.coffee 文件中
<!--StartFragment--> <!--EndFragment-->
首先先判断上面页面的值是否传入过来
app = window.app app.controller 'SettingsCtrl', ( $scope, $upload, dialogs, $state ) -> $scope.link $scope.versions #1.test invork #2.parameter #3.methed $scope.versionUpdate= -> alert($scope.link) alert($scope.versions)
刷新 页面 输入信息点击提交
打印出了我们想要的 信息 ok
说明跑通了
<!--StartFragment-->接下来我们要让传递过来的参数存入js 中以备后续存入数据库中
在这里数据库表我事先已经建好了 versions 字段 version_number = string , link = strin
<!--StartFragment--> <!--EndFragment-->
接下来在controllers目录下setting.coffee 里改为这些内容
//= require_tree ./settings
app = window.app
app.controller 'SettingsCtrl', ($scope,$upload,dialogs,$state,Version,$window) ->
$scope.link
$scope.versions
$scope.updateVersion = ->
Version.$put(
"/api/v1/versions/update", {version_name: $scope.versions, link: $scope.link,}
).then ((result) ->
$scope.alertWith("保存成功")
$window.location.reload()
), (error) ->
console.log(error)
然后在version.rb中写入这些内容
class API::V1::Versions < Grape::API
include API::V1::Helpers
doorkeeper_for :all
before do
# authenticate!
end
helpers do
# def permitted_params
# ActionController::Parameters.new(params[:settlement]).permit(
# :amount, :customer_id, :user_id, :order_id, order_ids: [], pay_records: []
# ).tap do |hash|
# hash[:pay_records] = params[:settlement][:pay_records]
# end
# end
end
resource :versions do
#
#功能
# => 更新数据库
#
#逻辑
#
# => 1.先删除库总所有文件
# 2.添加新的版本
#
desc "Update version"
put '/update' do
# 删除全部
Version.delete_all()
# 创建版本
Version.create!(
version_number:params[:version][:version_name],
link:params[:version][:link]
)
end
#
#功能
# => 获取版本号
#
#逻辑
# => 查询 verions 表第一条数据
#
#注意
# => /get 和 返回结果集名字要一致
#
desc "get version"
get '/get' do
@get = Version.last
return @get
end
end
end
大功告成 －－！
<!--EndFragment-->